jQuery驗證形式 - 的onsubmit火的fancybox窗口

的onsubmit我想火的fancybox彈出jQuery驗證形式 - 的onsubmit火的fancybox窗口

我只需要顯示的fancybox彈出一次的形式進行驗證（jQuery驗證使用）

它似乎彈出的fancybox彈出只有當表格填寫不正確！

http://gloss-hair.com/old/owl/OWLFORM.html

我不知道如何加載只有一次的形式進行驗證彈出的fancybox功能：

<script type="text/javascript"> 
$().ready(function() { 
    // validate the competition form when it is submitted 
    $("#ie9_competition").validate({ 
     errorPlacement: function (error, element) { 
      if (element.is(":checkbox")) { 
       error.appendTo(element.closest('div')); 
       } 
      else { 
       error.insertAfter(element.parent().find("label"));   
       } 
      }, 
     rules: {    
      sEmail: { 
       required: true, 
       email: true 
      }, 

     } 
    });   
});

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".fancybox4").fancybox({ 
      'hideOnContentClick': true 
     }); 
    }); 
</script>

來源

2012-04-09 Jai

嘗試這樣

$().ready(function() { 
     // validate the competition form when it is submitted 
     $("#ie9_competition").validate({ 
      errorPlacement: function (error, element) { 
       if (element.is(":checkbox")) { 
        error.appendTo(element.closest('div')); 
        } 
       else { 
        error.insertAfter(element.parent().find("label"));   
        } 
       }, 
      rules: {    
       sEmail: { 
        required: true, 
        email: true 
       }, 

      },   
      submitHandler: function(form){ 

       jQuery('.fancybox4').trigger('click'); 

      } 
     });   
    });

然後從表單標記中刪除onsubmit事件。所以，你的表單標籤是像

<form id="ie9_competition" method="post">

來源

2012-04-10 03:25:16

多數民衆贊成在此非常感謝這工作的一種享受 - 我最初添加它在上面 - 但我有一些語法問題（括號或缺少的東西）。令人敬畏的歡呼再次 – Jai 2012-04-10 08:16:32

嗯onsubmit也需要清除表單（以及彈出的fancybox消息工作）。你知道我可以如何清除表單一旦驗證，並提交onsubmit前進 - 再次感謝 – Jai 2012-04-11 17:51:56

@JaimieLisaStow：您可以使用「resetForm」重置驗證錯誤消息，可能必須清除所有字段值。 – 2012-04-12 03:51:19

jQuery驗證插件可以讓你定義submitHandler其執行如果表格有效：

submitHandler: function(form){ 
    form.submit(); // submit the form 
    // code to show your fancybox here 
}

你的validate（）的代碼如下所示：

$("#ie9_competition").validate({ 
errorPlacement: function (error, element) { 
    if (element.is(":checkbox")) { 
    error.appendTo(element.closest('div')); 
    } else { 
    error.insertAfter(element.parent().find("label"));   
    } 
}, 
rules: {    
    sEmail: { 
    required: true, 
    email: true 
    } 
}, 
submitHandler: function(form){ 
    form.submit(); // submit the form 
    // code to show your fancybox here 
} 
});

您可以看到驗證所有可用的選項（）方法在這裏：http://docs.jquery.com/Plugins/Validation/validate#toptions

來源

2012-04-09 16:55:44 azawaza

您好感謝您的回覆 - 我如何加入到我的驗證腳本 – Jai 2012-04-09 20:16:43

用同樣的方法，你有_rules：_和_errorPlacement：_在那裏選擇。 submitHandler只是另外一種選擇。 – azawaza 2012-04-10 02:47:07

PS：我已經編輯了上面的答案，其中包含完整的validate（）代碼，並在其中添加了submitHandler選項。 – azawaza 2012-04-10 02:54:22

jQuery驗證形式 - 的onsubmit火的fancybox窗口

回答

相關問題