0

我在单击按钮时验证下拉 asp 控件时遇到问题。我有一个面板，其中包含单选按钮、文本框、下拉菜单和保存按钮。如果选择了 zip 的单选按钮，则会出现一个下拉列表（与后面代码中的数据绑定），您必须从列表中选择一个 zip。我无法验证单击保存按钮的按钮是否从下拉列表中进行了选择。我想用 jQuery 来做，并尝试这样做，这样会弹出并提醒但它不起作用。喜欢让它在按钮的 onClick 之前验证选择。

<script type="text/javascript">
$(document).ready(function() {
    $('#btn_submit').click(function() {
        if ($('#ZIPDD').val() > 0) {
            return true;
        }
        else {
            alert('Please select a zip.');
            return false;
        }
    });

});


<asp:UpdatePanel runat="server" ID="UP6" ChildrenAsTriggers="false" UpdateMode="conditional">
<ContentTemplate>
    <table style="text-align:center;" cellpadding="5px">
        <tr>
            <td>
                <table runat="server" id="_table" width="100%" cellspacing="10">
                    <tr>
                        <td style="width:100px; font-weight:bold; padding-bottom:inherit;" valign="middle">
                            <div>STEP 1:</div>
                            <div>Enter a #</div>
                        </td>
                        <td align="left" valign="middle" style=" margin-bottom:15px;">
                            <asp:TextBox runat="server" ID="txt_nbr" Width="70px"/>
                            <asp:Button ID="Button1" Text="Continue" runat="server" OnClick="Button1_Click"/>
                        </td>
                    </tr>
                     <tr>
                        <td style="width:100px; font-weight:bold; margin-bottom:15px;" valign="middle">                              
                        </td>
                        <td style="border:2px solid gray; background-color:Silver;">
                            <table runat="server" id="SHTable" visible="false" width="100%">
                                <tr align="left">
                                    <th style="font-weight:bold;border-bottom:2px solid black;">Methods</th>
                                    <th style="font-weight:bold;border-bottom:2px solid black;">Location</th>
                                    <th style="font-weight:bold;border-bottom:2px solid black;">&nbsp;<asp:Label runat="server" ID="DOTEXT"></asp:Label></th>
                                </tr>
                                <tr align="left">
                                    <td>
                                        <div style="margin-bottom:10px;"><asp:CheckBox runat="server" ID="ZIP" Text="ZIP" AutoPostBack="true" OnCheckedChanged="ZIP_CheckedChanged" /></div>
                                    </td>
                                    <td style="width:300px;">
                                        <asp:DropDownList runat="server" ID="ZIPDD" Visible="false"/><br /><asp:Label ID="ziplabel" Visible="false" runat="server" style="color: red; font-size:12px;"/>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                     <tr>
                        <td style="width:100px; font-weight:bold; margin-bottom:15px;" valign="middle">
                            <div>Confirm changes and hit save</div>    
                        </td>
                        <td align="left" valign="middle">
                            <asp:Button Text="Save" runat="server" ID="btn_submit" OnClick="btn_submit_Click" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>

    </table>
</ContentTemplate>

绑定到页面加载后代码中的下拉列表

      protected void Page_Load(object sender, EventArgs e)
{
    if (ZIPDD.Items.Count == 0)
    {
        Loadzips();
    }
}
private void LoadBranches()
{
    using (SqlConnection SQLCONN)
    {
        SQLCONN.Open();
        SqlCommand SQLCOMM = SQLCONN.CreateCommand();
        SQLCOMM.CommandText = "SELECT * FROM table";
        IDataReader dr = SQLCOMM.ExecuteReader();
        ZIPDD.DataSource = dr;
        ZIPDD.DataValueField = "ZIPID";
        ZIPDD.DataTextField = "ZIPLABEL";
        ZIPDD.DataBind();
        ZIPDD.Items.Insert(0, new ListItem(String.Empty, String.Empty));
        ZIPDD.SelectedIndex = 0;
    }
}
4

2 回答 2

0

你为什么不看看使用 jQuery.validate 插件。它将验证所有附加了“必需”类的表单项。如果复选框被突出显示，您可以使用 jQuery 和 addClass 将所需的类添加到下拉列表中。

if($('#radio_button').is(':checked')) { 
$( ".dropDownClassIdentifier" ).addClass( "required" );
}
else
{
$( ".dropDownClassIdentifier" ).removeClass( "required" );
}

http://jqueryvalidation.org/和 http://api.jquery.com/addClass/是开始寻找文档的好地方

于 2013-08-27T16:58:26.220 回答
0

当您计划使用 javascript/jquery 时，请注意控件在客户端的呈现方式。您正在设置visible="false"表格和控件，它们永远不会在客户端呈现。您无法使用 jquery 找到它们。要正常工作，您需要设置：

<table runat="server" id="SHTable" visible="false" width="100%">

对此：

<table runat="server" id="SHTable" style="display:none" width="100%">

并改变这一点：

<asp:DropDownList runat="server" ID="ZIPDD" Visible="false"/>

对此：

<asp:DropDownList runat="server" ID="ZIPDD" style="display:none"/>

要测试您的脚本，请style="display:block"同时设置表格和下拉菜单，否则您将看到 porpup 以选择 zip（下拉值为 0）。

祝你好运！

于 2013-08-28T00:21:42.560 回答