Question

问候，在我当前的项目中，我有gridview，搜索按钮，搜索文本框，文本框和提交按钮。

- 我应该在搜索框中输入字符串，然后点击搜索按钮。 - 点击搜索按钮，它将检索所有匹配记录，然后将它们绑定到视图网格。

- 然后当我点击gridview中的记录时，它应该将一个字段绑定到第二个文本框。

最后我应该点击提交按钮提交页面。问题出在哪里：

- 我正在使用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>

Answer 1

您可以通过传递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>的{{1}}事件，但设置submit会阻止它执行这个。这使您可以手动调用验证... .valid()调用正在执行的操作，仅在您想要的按钮上。

Answer 2

我这样做的方法是让2个按钮不是提交按钮，而是常规按钮。单击要执行验证的那个时，请调用：

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

这会导致验证然后（如果通过）提交。

对于您不想验证的那个，您可以致电：

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

这将获取底层DOM元素并调用其提交 - 这不会触发由.validate

创建的'onsubmit'事件

如果有很多，如何将jquery验证与一个按钮相关联？

2 个答案: