使用文本框验证多个下拉列表

时间:2013-05-07 07:51:41

标签: jquery drop-down-menu asp-classic

我有一个表单,其中有多个下拉列表...如果我要验证单个下拉列表,我的代码工作正常......

使用此代码:

                if ($("select[id*=drpR]").val() == "Choose Reseller") {
                    $("#lblmessage").html("Please choose Reseller!");
                    return false;//To prevent the form from submitting.
                }
                else {
                    return true;
                }

但是当我必须验证一个带有3个下拉列表和许多文本框的表单时,我的jquery无法正常工作..现在我将把这个代码块放在哪里以便为我的验证正常运行..或者是否有更好的解决方案我的问题......

这是我的jquery所拥有的:

                 jQuery("#Merchant_Registration").validate({
                    rules: {
                        drpT: {
                            required: {
                                depends: function (element) {
                                    var flag = true;
                                    if ($("select[id*=drpT]").val() == "Choose Type") {
                                        //alert("Please select Merchant type");
                                        $("#lbldrpT").append("Please choose Type!");
                                        flag = false;//To prevent the form from submitting.
                                    } else {
                                        $("#lbldrpT").empty();
                                    }
                                },
                            },
                        },
                        LastName: "required",
                        FirstName: "required",
                        EmailAd: {
                            required: true,
                            email: true,
                            minlength: 8
                        },
                        CompanyN: "required",
                        url: "required",
                        drpI: {
                            required: {
                                depends: function (element) {
                                    var flag = true;
                                    if ($("select[id*=drpI]").val() == "Choose Industry") {
                                        $("#lbldrpI").append("Please choose Industry!");
                                        flag = false;//To prevent the form from submitting.
                                    } else {
                                        $("#lbldrpI").empty();
                                    }
                                },
                            },
                        },
                        HNumber: "required",
                        stADR: "required",
                        town: "required",
                        city: "required",
                        state: "required",
                        Zcode: "required",
                        drpC: {
                            required: {
                                depends: function (element) {
                                    var flag = true;
                                    if ($("select[id*=drpC]").val() == "Choose Country") {
                                        $("#lbldrpC").append("Please choose Coutnry!");
                                        flag = false;//To prevent the form from submitting.
                                    } else {
                                        $("#lbldrpC").empty();
                                    }
                                },
                            },
                        },
                        TNumber: "required",
                        FNumber: "required"
                    },
                    success: function () {
                        xval = true;
                    },
                    messages: {
                        FirstName: "Please enter your first name",
                        LastName: "Please enter your first name",
                        EmailAd: "Please enter a valid email address",
                        CompanyN: "Please enter company name",
                        url: "Please enter URL",
                        HNumber: "Please enter house number",
                        stADR: "Please enter street",
                        town: "Please enter town",
                        city: "Please enter city or municipality",
                        state: "Please enter state or province",
                        Zcode: "Please enter zip code",
                        TNumber: "Please enter telephone number",
                        FNumber: "Please enter fax number"
                    }
                });

                $("select").change(function () {
                    $("#lbl" + $(this).attr("id")).empty();
                })

                if (!jQuery("#Merchant_Registration").valid()) {
                    flag = false;
                    return false;
                }
                else {
                    return true;
                }
                if (flag) {
                    return true;
                }
                else {
                    return false;
                }

这是我的标记:

            <div id="step2" class="formwiz">
                <h4>Step 2: Personal Information</h4>
                <p>
                <label>Select Type:</label>
                <span class="field">
                <asp:DropDownList ID="drpT" runat="server" Width="160" class="required"></asp:DropDownList>
                <asp:Label ID="lbldrpT" runat="server" Text="" ForeColor="Red"></asp:Label>
                </span>
                </p>

                <p>
                <label>Firstname:</label>
                <span class="field">
                <asp:TextBox ID="FirstName" runat="server" MaxLength ="50"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>LastName:</label>
                <span class="field">
                <asp:TextBox ID="LastName" runat="server" MaxLength ="50"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Email Address</label>
                <span class="field">
                <asp:TextBox ID="EmailAd" runat="server"></asp:TextBox>
                </span>
               </p>

                <p>
                <label>Company Name:</label>
                <span class="field">
                <asp:TextBox ID="CompanyN" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Website URL:</label>
                <span class="field">
                <asp:TextBox ID="url" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Select Industry:</label>
                <span class="field">
                <asp:DropDownList ID="drpI" runat="server" Width="160" class="required"></asp:DropDownList>
                <asp:Label ID="lbldrpI" runat="server" Text="" ForeColor="Red"></asp:Label>
                </span>
                </p>

                <p>
                <label>House Number:</label>
                <span class="field">
                <asp:TextBox ID="HNumber" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Street Address:</label>
                <span class="field">
                <asp:TextBox ID="stADR" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Town:</label>
                <span class="field">
                <asp:TextBox ID="town" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>City:</label>
                <span class="field">
                <asp:TextBox ID="city" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>State:</label>
                <span class="field">
                <asp:TextBox ID="state" runat="server"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Zip Code:</label>
                <span class="field">
                <asp:TextBox ID="Zcode" runat="server" MaxLength="6"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Country:</label>
                <span class="field">
                <asp:DropDownList ID="drpC" runat="server" Width="160" class="required"></asp:DropDownList>
                <asp:Label ID="lbldrpC" runat="server" Text="" ForeColor="Red"></asp:Label>
                </span>
                </p>

                <p>
                <label>Telephone Number:</label>
                <span class="field">
                <asp:TextBox ID="TNumber" runat="server" MaxLength="11"></asp:TextBox>
                </span>
                </p>

                <p>
                <label>Fax Number:</label>
                <span class="field">
                <asp:TextBox ID="FNumber" runat="server" MaxLength="11"></asp:TextBox>
                </span>
                </p>
            </div>  

请帮忙......

1 个答案:

答案 0 :(得分:0)

var flag = true;
if ($("select[id*=drpT]").val() == "Choose Type") {
    //alert("Please select Merchant type");
    $("#lbldrpT").append("Please choose Reseller!");
    flag = false;//To prevent the form from submitting.
}else{
     $("#lbldrpT").empty();
}

if ($("select[id*=drpI]").val() == "Choose Industry") {
    $("#lbldrpI").append("Please choose Industry!");
    flag = false;//To prevent the form from submitting.
}else{
    $("#lbldrpI").empty();
}

if ($("select[id*=drpC]").val() == "Choose Country") {
    $("#lbldrpC").append("Please choose Coutnry!");
    flag = false;//To prevent the form from submitting.
}else{
    $("#lbldrpC").empty();
}

$("select").change(function(){
   $("#lbl"+$(this).attr("id")).empty(); 
   // or you can use this
  // $(this).parent().find("label").empty();
   //second one is better option
})

if (!jQuery("#Merchant_Registration").valid()) {
    flag = false;
}

if(flag)
   return true;
else
   return false;

在你的代码中,你在第一个if条件下返回,所以它永远不会转到下一个if else。所以举旗告诉我是否有问题。