按数据绑定下拉列表的特定文本显示/隐藏div

时间:2015-10-08 21:11:44

标签: jquery asp.net

我是编程新手。

我有一个数据绑定下拉列表,列出国家/地区列表的2013访问数据库。 我希望根据您所选择的国家/地区显示/隐藏有不同文本框(您填写移民日期)的部门。

示例:

如果您选择英国作为出生国,则会显示移民日期的文本框。但如果您选择美国作为出生国,则移民日期的文本框将不会显示。

我以为使用jquery,但它不起作用。 如何获取下拉列表中所选索引的值?

代码:

jquery:
$("#birthcountrylist").change(function)
{
if($(this).val()=="US") { $(divimmigratedate).hide(); }
else { $(divimmigratedate).show(); }
}); 

form:
<!-- Entering Birth Country /-->
<asp:DropDownList ID="birthcountrylist" runat="server" AutoPostBack="true" AppendDataBoundItems="true"></asp:DropDownList

<!--Entering Date of Immigration/-->
<div id="divimmigratedate" runat="server" style="display:none">
<asp:TextBox ID="dateimmigrate" runat="server" MaxLength="10" Width="13%" Text="" ></asp:TextBox>

back-code:
 protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            OleDbConnection db = new OleDbConnection("");
            db.ConnectionString = ConfigurationManager.ConnectionStrings["Provider=Microsoft.ACE.OLEDB.12.0;Data Source=countriesdb.accdb;"].ToString();
            db.Open();
            OleDbCommand cmd = new OleDbCommand();
            cmd.CommandText = "SELECT Countries FROM countryofbirth";
            cmd.Connection = db;
            OleDbCommand dbc = new OleDbCommand(cmd.CommandText, db);
            OleDbDataReader read = dbc.ExecuteReader();

            birthcountrylist.DataSource = read;
            birthcountrylist.DataTextField = "Countries";       
            birthcountrylist.DataValueField = "Countries";
            birthcountrylist.DataBind();
            read.Close();
            db.Close();
        }
    }

我认为我的问题在于这一部分:

if($(this).val()=="US")

由于

1 个答案:

答案 0 :(得分:0)

检查以下代码

 <script type="text/javascript">    
    $(document).ready(function () {
        $('#birthcountrylist').change(function () {
            if ($('#<%=birthcountrylist.ClientID %> option:selected').val() == "US") {
                alert("hello world1");
            }
            else {
                alert("hello world2");
            }
        })
    });       
</script> 

这里是HTML部分

 <asp:DropDownList ID="birthcountrylist" runat="server" AutoPostBack="true">
    <asp:ListItem Text="hello world 1" Value="US"></asp:ListItem>
    <asp:ListItem Text="hello world 2" Value="UK"></asp:ListItem>
</asp:DropDownList>

让我知道它是否有效,谢谢..