表單資料送出功能

desktop11/goto.js

@@ -70,7 +70,7 @@ $("#contact-form").submit(function (e) {
   var param_string = $('#contact-form').serialize();
   alert('param_string = ' + param_string);
   $.ajax({
-    type: 'GET',
+    type: 'POST',
     url: 'http://172.104.93.163/deco_request_detail',
     data: param_string,
     dataType: 'json',
@@ -94,6 +94,54 @@ $("#contact-form").submit(function (e) {
   return false;
 });
 
+$.fn.serializeObject = function() {
+	var o = {};
+	var a = this.serializeArray();
+  o["id"] = 0;
+	$.each(a, function() {
+		if(o[this.name]) {
+			if(!o[this.name].push) {
+				o[this.name] = [o[this.name]];
+			}
+			o[this.name].push(this.value || '');
+		} else {
+			o[this.name] = this.value || '';
+		}
+	});
+
+	return o;
+};
+
+function onClik() {
+/*	var formRef = $('#form1').serializeArray();
+	var jsonString = JSON.stringify(formRef);*/
+	var jsonInfo = $('.contact-form1').serializeObject();
+	var jsonString = JSON.stringify(jsonInfo);
+	alert(jsonString);
+  $.ajax({
+    type: 'POST',
+    url: 'http://172.104.93.163/deco_request_detail',
+    data:jsonString,
+    dataType: 'json',
+    success: function (data, textStatus, jqXHR) {
+
+      alert("送出成功");
+    },
+    beforeSend: function () {
+      alert("beforeSend");
+    },
+    complete: function () {
+      alert("complete");
+    },
+
+    error: function (jqXHR, textStatus, errorThrown) {
+      alert("送出失敗");
+
+    }
+  });
+  
+}
+
 
 
 $("*").each(function (index, element) {

desktop11/index.html

@@ -54,8 +54,8 @@
                     </div>
                 </div>
             <!-- </section> -->
-            <img class="arrow" data-gt-target="#top" data-gt-duration="800" data-gt-offset="0" src="./img/totop.png"
-                alt="">
+            <!-- <img class="arrow" data-gt-target="#top" data-gt-duration="800" data-gt-offset="0" src="./img/totop.png"
+                alt=""> -->
         </div>
 
         <div class="container-fluid" style="padding:0;margin: 0; ">
@@ -237,7 +237,7 @@
                 <form class="contact-form1">
                     <div id="contact-form">
                         <div id="form-left">
-                            <select name="location" id="location" required>
+                            <select name="loc" id="location" required>
                                 <option value="地區" disabled selected="selected">地區</option>
                                 <option class="option">基隆市</option>
                                 <option class="option">台北市</option>
@@ -260,7 +260,7 @@
                                 <option class="option">台東縣</option>
                                 <option class="option">澎湖縣</option>
                             </select>
-                            <select name="type" id="type" required>
+                            <select name="h_class" id="type" required>
                                 <option value="房屋類型" disabled selected="selected">房屋類型</option>
                                 <option class="option">預售屋</option>
                                 <option class="option">中古屋</option>
@@ -268,7 +268,7 @@
                                 <option class="option">毛胚屋</option>
                                 <option class="option">自地自建</option>
                             </select>
-                            <select name="modal" id="modal" required>
+                            <select name="type" id="modal" required>
                                 <option value="房屋型態" disabled selected="selected">房屋型態</option>
                                 <option class="option">透天</option>
                                 <option class="option">電梯華廈</option>
@@ -287,8 +287,8 @@
                                 <option class="option">400~500萬</option>
                                 <option class="option">500萬以上</option>
                             </select>
-                            <input name="square" type="text" id="square" placeholder="請輸入坪數" required>
-                            <select name="rooms" id="rooms" required style="margin-right:1.5vw">
+                            <input name="size" type="text" id="square" placeholder="請輸入坪數" required>
+                            <select name="bed_num" id="rooms" required style="margin-right:1.5vw">
                                 <option value="幾房" disabled selected="selected" >幾房</option>
                                 <option class="option">1房</option>
                                 <option class="option">2房</option>
@@ -299,12 +299,12 @@
                                 <option class="option">7房</option>
                                 <option class="option">8房</option>
                             </select>
-                            <select name="living room" id="livingroom" required style="margin-right:1.5vw">
+                            <select name="liv_num" id="livingroom" required style="margin-right:1.5vw">
                                 <option value="幾廳" disabled selected="selected" style="margin-right:25px">幾廳</option>
                                 <option class="option">1廳</option>
                                 <option class="option">2廳</option>
                             </select>
-                            <select name="bathroom" id="bathroom" required>
+                            <select name="bath_num" id="bathroom" required>
                                 <option value="地區" disabled selected="selected" >幾衛</option>
                                 <option class="option">1衛</option>
                                 <option class="option">2衛</option>
@@ -315,7 +315,7 @@
                                 <option class="option">7衛</option>
                                 <option class="option">8衛</option>
                             </select>
-                            <select name="cars" id="style" required>
+                            <select name="style" id="style" required>
                                 <option value="風格類型" disabled selected="selected">風格類型</option>
                                 <option class="option">現代風</option>
                                 <option class="option">鄉村風</option>
@@ -332,7 +332,7 @@
                                 <option class="option">工業風</option>
                                 <option class="option">異國風</option>
                             </select>
-                            <input type="text" id="date" placeholder="預選裝修日期" required>
+                            <input name="prefer_date" type="date" id="date" placeholder="預選裝修日期" required>
 
                         </div>
                         <div id="form-right">
@@ -340,10 +340,10 @@
                                 <img src="./img/logo/facebook.webp" alt="">
                                 使用FB填入信箱與姓名
                             </div>
-                            <input type="text" id="email" placeholder="請輸入信箱" required>
-                            <input type="text" id="name" placeholder="請輸入姓名" required>
-                            <input type="text" id="phone" placeholder="請輸入電話" required>
-                            <select name="cars" id="gender">
+                            <input type="text" name="email" id="email" placeholder="請輸入信箱" required>
+                            <input type="text" name="name" id="name" placeholder="請輸入姓名" required>
+                            <input type="text" name="phone" id="phone" placeholder="請輸入電話" required>
+                            <select name="gender" id="gender">
                                 <option value="性格" disabled selected="selected">性別</option>
                                 <option class="option">男</option>
                                 <option class="option">女</option>
@@ -354,7 +354,7 @@
 
                     </div>
                     <div class="form-btn">
-                        <input class="btn" style="opacity: 1;" type="submit" value="送出">
+                        <input class="btn" style="opacity: 1;" type="submit" onclick="onClik();" value="送出">
 
                     </div>
                 </form>

mobile/index.html

@@ -69,34 +69,37 @@
     <div class="btn">
         <button class="btn-main">預約居家布置諮詢</button>
     </div>
-    <section id="content1">
-        <h1 class="title">你有以下這些下困擾嗎</h1>
-        <div class="box">
-
-            <div class="text">
-                <div class="text2">
-                    <h2>裝修公司眾多</h2>
-                    <h2>不知道如何邀選最適合的設計師?</h2>
+    <div class="container-fluid">
+        <section id="content1">
+            <h1 class="title">你有以下這些下困擾嗎</h1>
+            <div class="box">
+    
+                <div class="text">
+                    <div class="text2">
+                        <h2>裝修公司眾多</h2>
+                        <h2>不知道如何邀選最適合的設計師?</h2>
+                    </div>
+                    <img src="./img/content/01.webp" alt="">
                 </div>
-                <img src="./img/content/01.webp" alt="">
-            </div>
-            <div class="text">
-                <div class="text2">
-                    <h2>擔心遇到不良裝修公司</h2>
-                    <h2>容易產生裝修糾紛</h2>
+                <div class="text">
+                    <div class="text2">
+                        <h2>擔心遇到不良裝修公司</h2>
+                        <h2>容易產生裝修糾紛</h2>
+                    </div>
+                    <img src="./img/content/02.webp" alt="">
                 </div>
-                <img src="./img/content/02.webp" alt="">
-            </div>
-            <div class="text">
-                <div class="text2">
-                    <h2>不了解裝修工程預算行情</h2>
-                    <h2>害怕被騙嗎?</h2>
+                <div class="text">
+                    <div class="text2">
+                        <h2>不了解裝修工程預算行情</h2>
+                        <h2>害怕被騙嗎?</h2>
+                    </div>
+                    <img src="./img/content/03.webp" alt="">
                 </div>
-                <img src="./img/content/03.webp" alt="">
-            </div>
-
+    
+    
+        </section>
 
-    </section>
+    </div>
     <section id="service">
         <h1 class="title">我們提供的服務</h1>
         <!-- <div class="service container-fluid ">
@@ -380,7 +383,7 @@
                 <option class="option" value="type">工業風</option>
                 <option class="option" value="type">異國風</option>
             </select>
-            <input type="text" id="date" placeholder="預選裝修日期" required>
+            <input type="date" id="date" placeholder="預選裝修日期" required>
             <div id="facebook">
                 <img src="./img/process/facebook.webp" alt="">
                 <p>使用FB填入信箱與姓名 </p>