jQuery驗證元素無形式

ASP.Net默認在根級別添加一個表單。這意味着我們需要僅在表單中添加所有控件。

但是我需要定義需要驗證的頁面的一小部分，我使用了jQuery驗證插件。

HTML

<html> 
<body> 
    <form method="post" action="AssetDetails.aspx" id="Form1" enctype="multipart/form- 
    data"> 
    //Other page content goes here. which doesnt require validation 

    <form class="form-horizontal" id="validation-form" method="get"> 
         <div class="row-fluid"> 
          <div class="widget-header header-color-blue2"> 
           <h5> 
            Step 1</h5> 
          </div> 
      <input type="email" name="ctl00$MainContent$AssetTabs$DefineCriticality$email" id="email" class="span6" /> 
         </div> 

    </form> 
    </form> 
    </body></html>

的Javascript

$(document).ready(function(){ 
    alert($('#validation-form').length); // gives 0, because this form nested under 
              another form generated by ASP.Net 

    $('#validation-form').validate({ 
      errorElement: 'span', 
      errorClass: 'help-inline', 
      focusInvalid: false, 
      rules: { 
       email: { 
        required: true, 
        email: true 
       }}, 
      messages: { 
       email: { 
        required: "Please provide a valid email.", 
        email: "Please provide a valid email." 
       }}, 
    errorPlacement: function (error, element) { 
     error.insertAfter(element); 
    } 
    }); 
    });

但問題是，我得到錯誤this[0]在jQuery驗證文件是不明確的。我發現在DOM中找不到#validation-form，因爲這種形式是在那個愚蠢的ASP.Net生成的根（父）元素中。

我們該如何處理？

有沒有一種方法，我們驗證元素使用jQuery驗證插件與表單？

編輯：得到了一些解決方法解決方案：

最後我做了父窗體和基於字段名稱添加規則這項工作。通過不同地生成控件名稱字段，ASP.Net webform再次開始出現問題。

這是圍繞代碼的工作。

var validationParams = { 
     errorElement: 'span', 
     errorClass: 'help-inline', 
     focusInvalid: false, 
     rules: {}, 
     messages: {}, 

     invalidHandler: function (event, validator) { 
      $('.alert-error', $('.login-form')).show(); 
     }, 

     highlight: function (e) { 
      $(e).closest('.control-group').removeClass('info').addClass('error'); 
     }, 

     success: function (e) { 
      $(e).closest('.control-group').removeClass('error').addClass('info'); 
      $(e).remove(); 
     }, 

     errorPlacement: function (error, element) { 
      error.insertAfter(element); 
     }, 

     submitHandler: function (form) { 
     }, 
     invalidHandler: function (form) { 
     } 
    }; 

    var emailFieldName = $('#email').attr('name'); 

    validationParams['rules'][emailFieldName] = { required: true }; 
    validationParams['messages'][emailFieldName] = { required: "Email is required" }; 

    $('#Form1').validate(validationParams);

有沒有做這件事的任何其他更好的辦法？

來源

2013-08-06 Murali Murugesan

可能重複沒有「形式「tag」（http：// stackoverflow。com/questions/6282680/jquery-validation-without-form-tag） –

我不告訴你其他選項，但你問了什麼，如果你可以使用驗證插件沒有形式。

絕對需要你有<form></form>標籤讓jQuery Validate插件正常工作，或者根本不需要。

如果使用ajax，你必須[把你ajax的jQuery驗證插件

您可以刪除或阻止action並仍使用jQuery驗證的submitHandler內。

你可以把你ajax並在submitHandler一個return false並且不會發生定期提交：

$(document).ready(function() { 

    $('#myform').validate({ // initialize plugin 
     // your rules & options, 
     submitHandler: function(form) { 
      // your ajax would go here 
      return false; // blocks regular submit since you have ajax 
     } 
    }); 

});

觀看演示：http://jsfiddle.net/NEPsc/5/

[jQuery驗證的

來源

2013-08-06 07:47:41

問題出在父窗體上，我的'＃validation-form'不可用。我更新了我的問題。我需要使用jQuery驗證插件進行驗證，並與表單一起使用:) –

您可以簡單地使用$（父窗體）.validate（），並對您需要的元素使用檢查（驗證），爲什麼要使用窗體在表單內？ –

我沒有使用。這就是ASP.Net愚蠢的webforms如何設計的。我們沒有去除那個父母表格的控件 –

jQuery驗證元素無形式

回答

相關問題