表單錯誤修正

desktopB/goto.js

@@ -4,69 +4,89 @@ $(".banner-slider").slick({
   arrows: false,
 });
 
+
+var emailPattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+
+
 function submit() {
+
+  // let loc = $("#loc option:selected").text();
+
+  let loc = $("#loc").val();
+
+
+  let h_class = $("#h_class").val();
+
+  let size = $("#size").val();
+
+  let name = $("#name").val();
+
+  let email = $("#email").val();
+
+  let phone = $("#phone").val();
+
+  let version = $("#version").val();
+
+
+
+  if (email == null) {
+    alert('請填寫email');
+    return;
+  }else if(!emailPattern.test(email)){
+    alert('請填寫正確的email格式');
+    return;
+  };
+
+  if (name == "") {
+    alert('請填寫姓名');
+    return;
+  };
+  if (phone == "") {
+    alert('請填寫連絡電話');
+    return;
+  } else if(!/^[09]{2}[0-9]{8}$/.test(phone)){
+    alert('請填寫正確的手機格式');
+    return;
+  };
+
+  if (loc == null) {
+    alert('請填寫所在區域');
+    return;
+  };
+
+  if (h_class == null) {
+    alert('請填寫房屋類型');
+    return;
+  };
+
+  if (size == null) {
+    alert('請填寫房屋實際坪數');
+    return;
+  };
+
+  let formdata = '';
+
+  formdata = '{"email": "' + email + '",'
+  formdata += '"name": "' + name + '",'
+  formdata += '"phone": "' + phone + '",'
+  formdata += '"loc": "' + loc + '",'
+  formdata += '"h_class": "' + h_class + '",'
+  formdata += '"version": "' + version + '",'
+  formdata += '"id": "' + 0 + '",'
+  formdata += '"time_stamp": "' + 0 + '",'
+  formdata += '"size": "' + size + '"}';
+
+  console.log(formdata);
+
   $('#submitbutton').text('表單送出中，請稍後');
-  
- let loc = $( "#loc option:selected" ).text();
-
- let h_class=$( "#h_class option:selected" ).text();
-
- let size=$( "#size option:selected" ).text();
-
- let name=$( "#name" ).val();
-
- let email=$( "#email" ).val();
-
- let phone=$( "#phone" ).val();
-
- let version=$( "#version" ).val();
-
-  /*	var formRef = $('#form1').serializeArray();
-  //   var jsonString = JSON.stringify(formRef);*/
-  //   $.fn.serializeObject = function () {
-  //     var o = {};
-  //     var a = this.serializeArray();
-  //     o["id"] = 0;
-  //     o["time_stamp"] = "";
-  //     $.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;
-  //   };
-
-  // var jsonInfo = $('.contact-form1').serializeObject();
-  // var jsonString = JSON.stringify(jsonInfo);
-  // console.log(jsonString);
- 
-  let formdata='';
-
-  formdata='{"email": "' + email + '",'
-  formdata+='"name": "' + name + '",'
-  formdata+='"phone": "' + phone + '",'
-  formdata+='"loc": "' + loc + '",'
-  formdata+='"h_class": "' + h_class + '",'
-  formdata+='"version": "' + version + '",'
-  formdata+='"id": "' + 0 + '",'
-  formdata+='"time_stamp": "' + 0 + '",'
-  formdata+='"size": "' + size + '"}';
-
-console.log(formdata);
-  
+
   $.ajax({
     type: 'POST',
     url: 'https://go.hhh.com.tw:8002/deco_request_detail',
     data: formdata,
     dataType: 'json',
     // async: false,
-    
+
     success: function (data) {
       console.log('送出成功: ' + data);
       if (data == 0) {
@@ -78,7 +98,7 @@ console.log(formdata);
             dataType: 'json',
             contentType: 'application/json; charset=utf-8',
             async: false,
-            
+
             success: function (res) {
               console.log('送出成功');
             },
@@ -86,7 +106,7 @@ console.log(formdata);
               console.error(error);
               console.log('送出失敗');
             }
-      
+
           });
         }
         // alert("送出成功");

desktopB/index.html

@@ -378,7 +378,7 @@
                     </div>
                 </form> -->
                 <div class="contact-form1">
-                    <input type="hidden" name="version" value="b">
+                    <input type="hidden" id="version" name="version" value="b">
                     <div id="contact-form" name="myForm">
                         <div id="form-left">
                             <input type="email" name="email" id="email" placeholder="電子信箱" required>
@@ -387,34 +387,34 @@
                                 pattern="09\d{2}\d{6}" required>
                             <select name="loc" id="loc" required>
                                 <option value="" disabled selected="selected">您目前所在地區?</option>
-                                <option class="option">基隆市</option>
-                                <option class="option">台北市</option>
-                                <option class="option">新北市</option>
-                                <option class="option">桃園市</option>
-                                <option class="option">新竹縣</option>
-                                <option class="option">新竹市</option>
-                                <option class="option">苗栗縣</option>
-                                <option class="option">台中市</option>
-                                <option class="option">彰化縣</option>
-                                <option class="option">南投縣</option>
-                                <option class="option">雲林縣</option>
-                                <option class="option">嘉義縣</option>
-                                <option class="option">嘉義市</option>
-                                <option class="option">台南市</option>
-                                <option class="option">高雄市</option>
-                                <option class="option">屏東縣</option>
-                                <option class="option">宜蘭縣</option>
-                                <option class="option">花蓮縣</option>
-                                <option class="option">台東縣</option>
-                                <option class="option">澎湖縣</option>
+                                <option class="option" value="基隆市">基隆市</option>
+                                <option class="option" value="台北市">台北市</option>
+                                <option class="option" value="新北市">新北市</option>
+                                <option class="option" value="桃園市">桃園市</option>
+                                <option class="option" value="新竹縣">新竹縣</option>
+                                <option class="option" value="新竹市">新竹市</option>
+                                <option class="option" value="苗栗縣">苗栗縣</option>
+                                <option class="option" value="台中市">台中市</option>
+                                <option class="option" value="彰化縣">彰化縣</option>
+                                <option class="option" value="南投縣">南投縣</option>
+                                <option class="option" value="雲林縣">雲林縣</option>
+                                <option class="option" value="嘉義縣">嘉義縣</option>
+                                <option class="option" value="嘉義市">嘉義市</option>
+                                <option class="option" value="台南市">台南市</option>
+                                <option class="option" value="高雄市">高雄市</option>
+                                <option class="option" value="屏東縣">屏東縣</option>
+                                <option class="option" value="宜蘭縣">宜蘭縣</option>
+                                <option class="option" value="花蓮縣">花蓮縣</option>
+                                <option class="option" value="台東縣">台東縣</option>
+                                <option class="option" value="澎湖縣">澎湖縣</option>
                             </select>
                             <select name="h_class" id="h_class" required>
-                                <option value="" disabled selected="selected">您目前房屋類型</option>
-                                <option class="option">預售屋</option>
-                                <option class="option">中古屋</option>
-                                <option class="option">新成屋</option>
-                                <option class="option">毛胚屋</option>
-                                <option class="option">自地自建</option>
+                                <option value="" disabled selected="selected">您目前房屋類型?</option>
+                                <option class="option" value="預售屋">預售屋</option>
+                                <option class="option" value="中古屋">中古屋</option>
+                                <option class="option" value="新成屋">新成屋</option>
+                                <option class="option" value="毛胚屋">毛胚屋</option>
+                                <option class="option" value="自地自建">自地自建</option>
                             </select>
                             <!-- <select name="type" id="modal" required>
                                 <option value="" disabled selected="selected">房屋型態</option>
@@ -437,13 +437,13 @@
                             </select> -->
                             <!-- <input name="size" type="text" id="square" placeholder="請輸入坪數" required> -->
                             <select name="size" id="size" required style="margin-right:1.5vw">
-                                <option value="" disabled selected="selected">您目前房屋實際坪數</option>
-                                <option class="option">10坪以下</option>
-                                <option class="option">11~20坪</option>
-                                <option class="option">21~30坪</option>
-                                <option class="option">31~40坪</option>
-                                <option class="option">41~50坪</option>
-                                <option class="option">51坪以上</option>
+                                <option value="" disabled selected="selected">您目前房屋實際坪數?</option>
+                                <option class="option" value="10坪以下">10坪以下</option>
+                                <option class="option" value="11~20坪">11~20坪</option>
+                                <option class="option" value="21~30坪">21~30坪</option>
+                                <option class="option" value="31~40坪">31~40坪</option>
+                                <option class="option" value="41~50坪">41~50坪</option>
+                                <option class="option" value="51坪以上">51坪以上</option>
                             </select>
                             <!-- <select name="bed_num" id="rooms" required style="margin-right:1.5vw">
                                 <option class="option" value="1">1房</option>
@@ -508,16 +508,15 @@
                                 <option class="option">男</option>
                                 <option class="option">女</option>
                             </select> -->
-                        <!-- <input type="checkbox" style="margin:30px 10px;" id="checkbox" checked><label
-                                for="agree" style="width: 40px;">同意</label><a target="https://hhh.com.tw/about/privacy_policy/"
-                                href="https://hhh.com.tw/about/privacy_policy/">免責聲明與隱私使用政策</a> -->
                         <div>
-                            <input type="checkbox" style="margin:15px 10px;" id="checkbox" checked><label for="agree"
-                                class="ms-1" style="width: 40px;">同意</label><a target="_blank"
+                            <input type="checkbox" style="margin:15px 10px;" id="checkbox" checked><label
+                                for="agree" class="ms-1" style="width: 40px;">同意</label><a
+                                target="_blank"
                                 href="https://hhh.com.tw/about/privacy_policy/">免責聲明與隱私使用政策</a>
                         </div>
                         <div>
-                            <input type="checkbox" style="margin:15px 10px;" class="custom-control-input" id="credit">
+                            <input type="checkbox" style="margin:15px 10px;" class="custom-control-input"
+                                id="credit" value="1">
                             <label class="custom-control-label w-75" for="credit">
                                 裝潢貸款享超長7年還款期，最低利率2.59%起。
                             </label>

mobileB/goto.js

@@ -4,70 +4,90 @@ $(".feedback-slider1").slick({
     speed: 1000,
     swipe: true,
   });
+
+
+var emailPattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+
   
   function submit() {
+
+    // let loc = $("#loc option:selected").text();
+  
+    let loc = $("#loc").val();
+  
+  
+    let h_class = $("#h_class").val();
+  
+    let size = $("#size").val();
+  
+    let name = $("#name").val();
+  
+    let email = $("#email").val();
+  
+    let phone = $("#phone").val();
+  
+    let version = $("#version").val();
+  
+  
+  
+    if (email == null) {
+      alert('請填寫email');
+      return;
+    }else if(!emailPattern.test(email)){
+      alert('請填寫正確的email格式');
+      return;
+    };
+  
+    if (name == "") {
+      alert('請填寫姓名');
+      return;
+    };
+    if (phone == "") {
+      alert('請填寫連絡電話');
+      return;
+    } else if(!/^[09]{2}[0-9]{8}$/.test(phone)){
+      alert('請填寫正確的手機格式');
+      return;
+    };
+  
+    if (loc == null) {
+      alert('請填寫所在區域');
+      return;
+    };
+  
+    if (h_class == null) {
+      alert('請填寫房屋類型');
+      return;
+    };
+  
+    if (size == null) {
+      alert('請填寫房屋實際坪數');
+      return;
+    };
+  
+    let formdata = '';
+  
+    formdata = '{"email": "' + email + '",'
+    formdata += '"name": "' + name + '",'
+    formdata += '"phone": "' + phone + '",'
+    formdata += '"loc": "' + loc + '",'
+    formdata += '"h_class": "' + h_class + '",'
+    formdata += '"version": "' + version + '",'
+    formdata += '"id": "' + 0 + '",'
+    formdata += '"time_stamp": "' + 0 + '",'
+    formdata += '"size": "' + size + '"}';
+  
+    console.log(formdata);
+  
     $('#submitbutton').text('表單送出中，請稍後');
-    
-   let loc = $( "#loc option:selected" ).text();
-  
-   let h_class=$( "#h_class option:selected" ).text();
-  
-   let size=$( "#size option:selected" ).text();
-  
-   let name=$( "#name" ).val();
-  
-   let email=$( "#email" ).val();
-  
-   let phone=$( "#phone" ).val();
-  
-   let version=$( "#version" ).val();
-  
-    /*	var formRef = $('#form1').serializeArray();
-    //   var jsonString = JSON.stringify(formRef);*/
-    //   $.fn.serializeObject = function () {
-    //     var o = {};
-    //     var a = this.serializeArray();
-    //     o["id"] = 0;
-    //     o["time_stamp"] = "";
-    //     $.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;
-    //   };
-  
-    // var jsonInfo = $('.contact-form1').serializeObject();
-    // var jsonString = JSON.stringify(jsonInfo);
-    // console.log(jsonString);
-   
-    let formdata='';
-  
-    formdata='{"email": "' + email + '",'
-    formdata+='"name": "' + name + '",'
-    formdata+='"phone": "' + phone + '",'
-    formdata+='"loc": "' + loc + '",'
-    formdata+='"h_class": "' + h_class + '",'
-    formdata+='"version": "' + version + '",'
-    formdata+='"id": "' + 0 + '",'
-    formdata+='"time_stamp": "' + 0 + '",'
-    formdata+='"size": "' + size + '"}';
-  
-  console.log(formdata);
-    
+  
     $.ajax({
       type: 'POST',
       url: 'https://go.hhh.com.tw:8002/deco_request_detail',
       data: formdata,
       dataType: 'json',
       // async: false,
-      
+  
       success: function (data) {
         console.log('送出成功: ' + data);
         if (data == 0) {
@@ -79,7 +99,7 @@ $(".feedback-slider1").slick({
               dataType: 'json',
               contentType: 'application/json; charset=utf-8',
               async: false,
-              
+  
               success: function (res) {
                 console.log('送出成功');
               },
@@ -87,7 +107,7 @@ $(".feedback-slider1").slick({
                 console.error(error);
                 console.log('送出失敗');
               }
-        
+  
             });
           }
           // alert("送出成功");

mobileB/index.html

@@ -321,7 +321,7 @@
                     </div>
                 </form> -->
                 <div class="contact-form1">
-                    <input type="hidden" name="version" value="b">
+                    <input type="hidden" id="version" name="version" value="b">
                     <div id="contact-form" name="myForm">
                         <div id="form-left">
                             <input type="email" name="email" id="email" placeholder="電子信箱" required>
@@ -330,34 +330,34 @@
                                 pattern="09\d{2}\d{6}" required>
                             <select name="loc" id="loc" required>
                                 <option value="" disabled selected="selected">您目前所在地區?</option>
-                                <option class="option">基隆市</option>
-                                <option class="option">台北市</option>
-                                <option class="option">新北市</option>
-                                <option class="option">桃園市</option>
-                                <option class="option">新竹縣</option>
-                                <option class="option">新竹市</option>
-                                <option class="option">苗栗縣</option>
-                                <option class="option">台中市</option>
-                                <option class="option">彰化縣</option>
-                                <option class="option">南投縣</option>
-                                <option class="option">雲林縣</option>
-                                <option class="option">嘉義縣</option>
-                                <option class="option">嘉義市</option>
-                                <option class="option">台南市</option>
-                                <option class="option">高雄市</option>
-                                <option class="option">屏東縣</option>
-                                <option class="option">宜蘭縣</option>
-                                <option class="option">花蓮縣</option>
-                                <option class="option">台東縣</option>
-                                <option class="option">澎湖縣</option>
+                                <option class="option" value="基隆市">基隆市</option>
+                                <option class="option" value="台北市">台北市</option>
+                                <option class="option" value="新北市">新北市</option>
+                                <option class="option" value="桃園市">桃園市</option>
+                                <option class="option" value="新竹縣">新竹縣</option>
+                                <option class="option" value="新竹市">新竹市</option>
+                                <option class="option" value="苗栗縣">苗栗縣</option>
+                                <option class="option" value="台中市">台中市</option>
+                                <option class="option" value="彰化縣">彰化縣</option>
+                                <option class="option" value="南投縣">南投縣</option>
+                                <option class="option" value="雲林縣">雲林縣</option>
+                                <option class="option" value="嘉義縣">嘉義縣</option>
+                                <option class="option" value="嘉義市">嘉義市</option>
+                                <option class="option" value="台南市">台南市</option>
+                                <option class="option" value="高雄市">高雄市</option>
+                                <option class="option" value="屏東縣">屏東縣</option>
+                                <option class="option" value="宜蘭縣">宜蘭縣</option>
+                                <option class="option" value="花蓮縣">花蓮縣</option>
+                                <option class="option" value="台東縣">台東縣</option>
+                                <option class="option" value="澎湖縣">澎湖縣</option>
                             </select>
                             <select name="h_class" id="h_class" required>
-                                <option value="" disabled selected="selected">您目前房屋類型</option>
-                                <option class="option">預售屋</option>
-                                <option class="option">中古屋</option>
-                                <option class="option">新成屋</option>
-                                <option class="option">毛胚屋</option>
-                                <option class="option">自地自建</option>
+                                <option value="" disabled selected="selected">您目前房屋類型?</option>
+                                <option class="option" value="預售屋">預售屋</option>
+                                <option class="option" value="中古屋">中古屋</option>
+                                <option class="option" value="新成屋">新成屋</option>
+                                <option class="option" value="毛胚屋">毛胚屋</option>
+                                <option class="option" value="自地自建">自地自建</option>
                             </select>
                             <!-- <select name="type" id="modal" required>
                                 <option value="" disabled selected="selected">房屋型態</option>
@@ -380,13 +380,13 @@
                             </select> -->
                             <!-- <input name="size" type="text" id="square" placeholder="請輸入坪數" required> -->
                             <select name="size" id="size" required style="margin-right:1.5vw">
-                                <option value="" disabled selected="selected">您目前房屋實際坪數</option>
-                                <option class="option">10坪以下</option>
-                                <option class="option">11~20坪</option>
-                                <option class="option">21~30坪</option>
-                                <option class="option">31~40坪</option>
-                                <option class="option">41~50坪</option>
-                                <option class="option">51坪以上</option>
+                                <option value="" disabled selected="selected">您目前房屋實際坪數?</option>
+                                <option class="option" value="10坪以下">10坪以下</option>
+                                <option class="option" value="11~20坪">11~20坪</option>
+                                <option class="option" value="21~30坪">21~30坪</option>
+                                <option class="option" value="31~40坪">31~40坪</option>
+                                <option class="option" value="41~50坪">41~50坪</option>
+                                <option class="option" value="51坪以上">51坪以上</option>
                             </select>
                             <!-- <select name="bed_num" id="rooms" required style="margin-right:1.5vw">
                                 <option class="option" value="1">1房</option>
@@ -451,24 +451,21 @@
                                 <option class="option">男</option>
                                 <option class="option">女</option>
                             </select> -->
-                        <!-- <input type="checkbox" style="margin:30px 10px;" id="checkbox" checked><label
-                                for="agree" style="width: 40px;">同意</label><a target="https://hhh.com.tw/about/privacy_policy/"
-                                href="https://hhh.com.tw/about/privacy_policy/">免責聲明與隱私使用政策</a> -->
                         <div>
-                            <input type="checkbox" style="margin:15px 10px;" id="checkbox" checked><label for="agree"
-                                class="ms-1" style="width: 40px;">同意</label><a target="_blank"
+                            <input type="checkbox" style="margin:15px 10px;" id="checkbox" checked><label
+                                for="agree" class="ms-1" style="width: 40px;">同意</label><a
+                                target="_blank"
                                 href="https://hhh.com.tw/about/privacy_policy/">免責聲明與隱私使用政策</a>
                         </div>
-                        <div class="my-2">
-                            <input type="checkbox" style="margin:0px 10px; position: relative; bottom:20px;"
-                                class="custom-control-input" id="credit">
+                        <div>
+                            <input type="checkbox" style="margin:15px 10px;" class="custom-control-input"
+                                id="credit" value="1">
                             <label class="custom-control-label w-75" for="credit">
                                 裝潢貸款享超長7年還款期，最低利率2.59%起。
                             </label>
                         </div>
                         <div class="form-btn">
-                            <button id="submitbutton" class="btn" style="opacity: 1;" type="submit"
-                                onclick="submit()">送出</button>
+                            <button id="submitbutton" class="btn" style="opacity: 1;" type="submit" onclick="submit()">送出</button>
                         </div>
                     </div>
                 </div>