Две формы в fancybox
День добрый! Создал модальное окно плагином fancybox. Работает все хорошо
<div class="zakaz"> <a class="zakaz2" href="#inline"></a> </div> <div id="inline"> <h2>Ваша заявка</h2> <form id="contact" name="contact" action="#" method="post"> <label for="email">Ваш E-mail</label> <input type="email" id="email" name="email" class="txt"> <br> <label for="name">Ваше имя</label> <input type="text" id="name" name="name" class="txt"> <br> <label for="phone">Телефон</label> <input type="text" id="phone" name="phone" class="txt"> <br> <label style="width: 153px" for="msg">Наименование и количество оборудования</label> <textarea id="msg" name="msg" class="txtarea"></textarea> <button id="send">Отправить</button> </form> </div> function validateEmail(email) { var reg = /^(([^<>()[\]\\.,;:\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,}))$/; return reg.test(email); } jQuery(document).ready(function() { jQuery(".zakaz2").fancybox(); jQuery("#contact").submit(function() { return false; }); jQuery("#send").on("click", function(){ var emailval = jQuery("#email").val(); var msgval = jQuery("#msg").val(); var msglen = msgval.length; var mailvalid = validateEmail(emailval); if(mailvalid == false) { jQuery("#email").addClass("error"); } else if(mailvalid == true){ jQuery("#email").removeClass("error"); } if(msglen < 4) { jQuery("#msg").addClass("error"); } else if(msglen >= 4){ jQuery("#msg").removeClass("error"); } if(mailvalid == true && msglen >= 4) { // если РѕР±Рµ проверки пройдены // сначала РјС‹ скрываем РєРЅРѕРїРєСѓ отправки jQuery("#send").replaceWith("<em>отправка...</em>"); jQuery.ajax({ type: 'POST', url: 'http://salepump.ru/sendmessage.php', data: jQuery("#contact").serialize(), success: function(data) { if(data == "true") { jQuery("#contact").fadeOut("fast", function(){ jQuery(this).before("<p><strong>Ваша заявка успешно отправлена. Р’ ближайшее время РјС‹ РЅР° неё ответим</strong></p>"); setTimeout("$.fancybox.close()", 1000); }); } } }); } }); }); Но при создании уже второй формы, окно появляется, но не отправляется запрос. Ну у первой, ни у второй формы. Делаю таким образом: <a class="zvonok" href="#inlinee">Заказать обратный звонок</a> <div id="inlinee"> <h2>Обратный звонок</h2> <form id="contact" name="contact" action="#" method="post"> <label for="name">Ваше имя</label> <input type="text" id="name" name="name" class="txt"> <br> <label for="phone">Телефон</label> <input type="text" id="phone" name="phone" class="txt"> <br> <label style="width: 153px" for="msg">Вопрос</label> <textarea id="msg" name="msg" class="txtarea"></textarea> <button id="send">Отправить</button> </form> </div> function validateEmail(email) { var reg = /^(([^<>()[\]\\.,;:\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,}))$/; return reg.test(email); } jQuery(document).ready(function() { jQuery(".zvonok").fancybox(); jQuery("#contact").submit(function() { return false; }); jQuery("#send").on("click", function(){ var emailval = jQuery("#email").val(); var msgval = jQuery("#msg").val(); var msglen = msgval.length; var mailvalid = validateEmail(emailval); if(mailvalid == false) { jQuery("#email").addClass("error"); } else if(mailvalid == true){ jQuery("#email").removeClass("error"); } if(msglen < 4) { jQuery("#msg").addClass("error"); } else if(msglen >= 4){ jQuery("#msg").removeClass("error"); } if(mailvalid == true && msglen >= 4) { // если РѕР±Рµ проверки пройдены // сначала РјС‹ скрываем РєРЅРѕРїРєСѓ отправки jQuery("#send").replaceWith("<em>отправка...</em>"); jQuery.ajax({ type: 'POST', url: 'http://salepump.ru/callback.php', data: jQuery("#contact").serialize(), success: function(data) { if(data == "true") { jQuery("#contact").fadeOut("fast", function(){ jQuery(this).before("<p><strong>Ваша заявка успешно отправлена. Р’ ближайшее время РјС‹ РЅР° неё ответим</strong></p>"); setTimeout("$.fancybox.close()", 1000); }); } } }); } }); }); |
Часовой пояс GMT +3, время: 10:33. |