如何關聯jquery驗證只有一個按鈕，如果有很多？

Greetings，在我目前的項目中，我有gridview，搜索按鈕，搜索文本框，文本框和提交按鈕。如何關聯jquery驗證只有一個按鈕，如果有很多？

- 我應該在搜索框中輸入字符串，然後點擊搜索按鈕。 - 單擊搜索按鈕時，它將檢索所有匹配記錄，然後將它們綁定到視圖網格。

- 然後當我在gridview中單擊一條記錄時，它應該將一個字段綁定到第二個文本框。

終於我應該通過點擊提交按鈕來提交頁面。問題出在哪裏：

-the問題我正在使用jquery驗證插件，將使第二個文本框是必需的。 - 當我點擊搜索按鈕將不允許回發，直到我寫在第二個文本框中的東西。

如何讓第二個文本框僅在點擊asp.net提交按鈕時纔對必填字段進行驗證。

這裏是我的代碼：

<%@ Page Title="" Language="C#" MasterPageFile="~/Master.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="IMAM_APPLICATION.WebForm1" %> 

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> 

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> 

    <script src="js/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 

    <script src="js/jquery.validate.js" type="text/javascript"></script> 
    <script src="js/js.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 



    $("#aspnetForm").validate({ 


      // debug: true, 


      rules: { 

      "<%=txtFirstName.UniqueID %>": { 

       required: true 


      } 

       }, 
        errorElement: "mydiv", 
      wrapper: "mydiv", // a wrapper around the error message 

      errorPlacement: function(error, element) { 
       offset = element.offset(); 
       error.insertBefore(element) 
       error.addClass('message'); // add a class to the wrapper 
       error.css('position', 'absolute'); 
       error.css('left', offset.left + element.outerWidth()); 
       error.css('top', offset.top - (element.height()/2)); 

      } 



     }); 
    }) 



</script> 

    <div id="mydiv"> 
    <asp:GridView ID="GridView1" runat="server" 

         style="position:absolute; top: 280px; left: 30px; height: 240px; width: 915px;" 
         PageSize="5" 
        onselectedindexchanged="GridView1_SelectedIndexChanged" 
         AutoGenerateColumns="False" DataKeyNames="idcontact_info"> 
        <Columns> 
         <asp:CommandField ShowSelectButton="True" InsertVisible="False" 
          ShowCancelButton="False" /> 
         <asp:BoundField DataField="First_Name" HeaderText="First Name" /> 
         <asp:BoundField AccessibleHeaderText="Midle Name" DataField="Midle_Name" /> 
         <asp:BoundField DataField="Last_Name" HeaderText="Last Name" /> 
         <asp:BoundField DataField="Phone_home" HeaderText="Phone Home" /> 
         <asp:BoundField DataField="cell_home" HeaderText="Mobile Home" /> 
         <asp:BoundField DataField="phone_work" HeaderText="Phone Work" /> 
         <asp:BoundField DataField="cell_Work" HeaderText="Mobile Work" /> 
         <asp:BoundField DataField="Email_Home" HeaderText="Personal Home" /> 
         <asp:BoundField DataField="Email_work" HeaderText="Work Email" /> 
        </Columns> 
       </asp:GridView> 
    <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" 
     DeleteMethod="Delete" InsertMethod="Insert" 
     OldValuesParameterFormatString="original_{0}" SelectMethod="GetData" 
     TypeName="IMAM_APPLICATION.DSContactTableAdapters.contact_infoTableAdapter" 
     UpdateMethod="Update"> 
     <DeleteParameters> 
      <asp:Parameter Name="Original_idcontact_info" Type="Int32" /> 
     </DeleteParameters> 
     <UpdateParameters> 
      <asp:Parameter Name="Title" Type="String" /> 
      <asp:Parameter Name="First_Name" Type="String" /> 
      <asp:Parameter Name="Midle_Name" Type="String" /> 
      <asp:Parameter Name="Last_Name" Type="String" /> 
      <asp:Parameter Name="Address1_Home" Type="String" /> 
      <asp:Parameter Name="Address2_Home" Type="String" /> 
      <asp:Parameter Name="City_Home" Type="String" /> 
      <asp:Parameter Name="State_Home" Type="String" /> 
      <asp:Parameter Name="Prov_Home" Type="String" /> 
      <asp:Parameter Name="ZipCode_Home" Type="String" /> 
      <asp:Parameter Name="Country_Home" Type="String" /> 
      <asp:Parameter Name="Phone_home" Type="String" /> 
      <asp:Parameter Name="Phone_Home_Ext" Type="String" /> 
      <asp:Parameter Name="Cell_home" Type="String" /> 
      <asp:Parameter Name="Fax_home" Type="String" /> 
      <asp:Parameter Name="Email_Home" Type="String" /> 
      <asp:Parameter Name="material_status" Type="String" /> 
      <asp:Parameter Name="DateOfBrith" Type="String" /> 
      <asp:Parameter Name="company" Type="String" /> 
      <asp:Parameter Name="Work_Field" Type="String" /> 
      <asp:Parameter Name="Occupation" Type="String" /> 
      <asp:Parameter Name="sub_Occupation" Type="String" /> 
      <asp:Parameter Name="Other" Type="String" /> 
      <asp:Parameter Name="Address1_work" Type="String" /> 
      <asp:Parameter Name="Address2_work" Type="String" /> 
      <asp:Parameter Name="City_Work" Type="String" /> 
      <asp:Parameter Name="State_Work" Type="String" /> 
      <asp:Parameter Name="Prov_Work" Type="String" /> 
      <asp:Parameter Name="ZipCode_Work" Type="String" /> 
      <asp:Parameter Name="Country_Work" Type="String" /> 
      <asp:Parameter Name="Phone_Work" Type="String" /> 
      <asp:Parameter Name="Phone_Work_Ext" Type="String" /> 
      <asp:Parameter Name="Cell_Work" Type="String" /> 
      <asp:Parameter Name="Fax_Work" Type="String" /> 
      <asp:Parameter Name="Email_work" Type="String" /> 
      <asp:Parameter Name="WebSite" Type="String" /> 
      <asp:Parameter Name="Note" Type="String" /> 
      <asp:Parameter Name="Groups" Type="String" /> 
      <asp:Parameter Name="InterPhoneHome" Type="Int32" /> 
      <asp:Parameter Name="InterMobileHome" Type="Int32" /> 
      <asp:Parameter Name="InterFaxHome" Type="Int32" /> 
      <asp:Parameter Name="InterPhoneWork" Type="Int32" /> 
      <asp:Parameter Name="InterMobileWork" Type="Int32" /> 
      <asp:Parameter Name="InterFaxWork" Type="Int32" /> 
      <asp:Parameter Name="rdoPhoneHome" Type="Int32" /> 
      <asp:Parameter Name="rdoMobileHome" Type="Int32" /> 
      <asp:Parameter Name="rdoEmailHome" Type="Int32" /> 
      <asp:Parameter Name="rdoPhoneWork" Type="Int32" /> 
      <asp:Parameter Name="rdoMobileWork" Type="Int32" /> 
      <asp:Parameter Name="rdoEmailWork" Type="Int32" /> 
      <asp:Parameter Name="locationHome" Type="Int32" /> 
      <asp:Parameter Name="locationWork" Type="Int32" /> 
      <asp:Parameter Name="Original_idcontact_info" Type="Int32" /> 
     </UpdateParameters> 
     <InsertParameters> 
      <asp:Parameter Name="Title" Type="String" /> 
      <asp:Parameter Name="First_Name" Type="String" /> 
      <asp:Parameter Name="Midle_Name" Type="String" /> 
      <asp:Parameter Name="Last_Name" Type="String" /> 
      <asp:Parameter Name="Address1_Home" Type="String" /> 
      <asp:Parameter Name="Address2_Home" Type="String" /> 
      <asp:Parameter Name="City_Home" Type="String" /> 
      <asp:Parameter Name="State_Home" Type="String" /> 
      <asp:Parameter Name="Prov_Home" Type="String" /> 
      <asp:Parameter Name="ZipCode_Home" Type="String" /> 
      <asp:Parameter Name="Country_Home" Type="String" /> 
      <asp:Parameter Name="Phone_home" Type="String" /> 
      <asp:Parameter Name="Phone_Home_Ext" Type="String" /> 
      <asp:Parameter Name="Cell_home" Type="String" /> 
      <asp:Parameter Name="Fax_home" Type="String" /> 
      <asp:Parameter Name="Email_Home" Type="String" /> 
      <asp:Parameter Name="material_status" Type="String" /> 
      <asp:Parameter Name="DateOfBrith" Type="String" /> 
      <asp:Parameter Name="company" Type="String" /> 
      <asp:Parameter Name="Work_Field" Type="String" /> 
      <asp:Parameter Name="Occupation" Type="String" /> 
      <asp:Parameter Name="sub_Occupation" Type="String" /> 
      <asp:Parameter Name="Other" Type="String" /> 
      <asp:Parameter Name="Address1_work" Type="String" /> 
      <asp:Parameter Name="Address2_work" Type="String" /> 
      <asp:Parameter Name="City_Work" Type="String" /> 
      <asp:Parameter Name="State_Work" Type="String" /> 
      <asp:Parameter Name="Prov_Work" Type="String" /> 
      <asp:Parameter Name="ZipCode_Work" Type="String" /> 
      <asp:Parameter Name="Country_Work" Type="String" /> 
      <asp:Parameter Name="Phone_Work" Type="String" /> 
      <asp:Parameter Name="Phone_Work_Ext" Type="String" /> 
      <asp:Parameter Name="Cell_Work" Type="String" /> 
      <asp:Parameter Name="Fax_Work" Type="String" /> 
      <asp:Parameter Name="Email_work" Type="String" /> 
      <asp:Parameter Name="WebSite" Type="String" /> 
      <asp:Parameter Name="Note" Type="String" /> 
      <asp:Parameter Name="Groups" Type="String" /> 
      <asp:Parameter Name="InterPhoneHome" Type="Int32" /> 
      <asp:Parameter Name="InterMobileHome" Type="Int32" /> 
      <asp:Parameter Name="InterFaxHome" Type="Int32" /> 
      <asp:Parameter Name="InterPhoneWork" Type="Int32" /> 
      <asp:Parameter Name="InterMobileWork" Type="Int32" /> 
      <asp:Parameter Name="InterFaxWork" Type="Int32" /> 
      <asp:Parameter Name="rdoPhoneHome" Type="Int32" /> 
      <asp:Parameter Name="rdoMobileHome" Type="Int32" /> 
      <asp:Parameter Name="rdoEmailHome" Type="Int32" /> 
      <asp:Parameter Name="rdoPhoneWork" Type="Int32" /> 
      <asp:Parameter Name="rdoMobileWork" Type="Int32" /> 
      <asp:Parameter Name="rdoEmailWork" Type="Int32" /> 
      <asp:Parameter Name="locationHome" Type="Int32" /> 
      <asp:Parameter Name="locationWork" Type="Int32" /> 
     </InsertParameters> 
    </asp:ObjectDataSource> 

        <asp:TextBox ID="txtSearch" runat="server" 
        style="position:absolute; top: 560px; left: 170px;" ></asp:TextBox> 

        <asp:Button ID="btnSearch" runat="server" Text="Search" 
        style="position:absolute; top: 555px; left: 375px;" 
        CausesValidation="False" onclick="btnSearch_Click"/> 

        <asp:Label ID="Label7" runat="server" Style="position: absolute; top: 630px; left: 85px;" 
        Text="First Name"></asp:Label> 

       <asp:TextBox ID="txtFirstName" runat="server" Style="top: 630px; left: 185px; position: absolute; 
        height: 22px; width: 128px"></asp:TextBox> 
<asp:Button ID="submit" runat="server" Text="submit" /> 



</div>  
</asp:Content>

來源

2010-05-14 Eyla

您可以禁用通過將onsubmit option，這樣提交默認阻止：

$("#aspnetForm").validate({ 
    onsubmit: false, 
    rules: { 
     "<%=txtFirstName.UniqueID %>": { 
      required: true 
     } 

    }, 
    errorElement: "mydiv", 
    wrapper: "mydiv", 
    errorPlacement: function(error, element) { 
     offset = element.offset(); 
     error.insertBefore(element) 
     error.addClass('message'); // add a class to the wrapper 
     error.css('position', 'absolute'); 
     error.css('left', offset.left + element.outerWidth()); 
     error.css('top', offset.top - (element.height()/2)); 

    } 
});

然後調用.valid()方法上只有該按鈕，像這樣：

$("#<%=submit.ClientID%>").click(function() { 
    return $("#aspnetForm").valid(); 
});

當你點擊提交按鈕明確，你是在調用的驗證，通常的驗證插件鑽機到<form>的submit事件，但設置onsubmit:false從這樣停止它。這讓您無論何時都需要手動調用驗證......這就是.valid()調用正在做的事情，只在您想要的按鈕上進行。

來源

2010-05-14 00:59:00

我這樣做是有2個按鈕，而不是提交按鈕的方式，但常規按鈕。當您想要執行驗證的單擊時，請致電：

$("#aspnetForm").submit();

這會導致驗證（如果通過）提交。

對於你不想驗證一個，您可以撥打：

$("#aspnetForm").get(0).submit();

這得到潛在的DOM元素，並調用其提交 - 這不會觸發通過創建「的onsubmit」事件。驗證

來源

2010-05-14 00:54:47

如何關聯jquery驗證只有一個按鈕，如果有很多？

回答

相關問題