0

在第一列中,我显示了大学列表。每个学院都有多个课程,这些课程已显示在第二列中。

对用户选择的限制:

当用户选择一所大学(比如麻省理工学院)时,应该允许他只选择与所选大学相对应的课程(在这种情况下是计算机科学和机械工程)。

如何使用 jQuery 实现此功能?

我将以下数据绑定到嵌套中继器中。

    public string currentCollege { get; set; }
    Dictionary<string, List<string>> colleges;
    class College
    {
        public College(string s)
        {
            Course = s;
        }
        public string Course { get; set; }
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        colleges = new Dictionary<string, List<string>>();
        colleges.Add("mit", new List<string>(new string[] { "computer science", "mechanical engg." }));
        colleges.Add("caltech", new List<string>(new string[] { "electrical engg", "cryptography"}));
        colleges.Add("harvard", new List<string>(new string[] { "language", "arts", "science" }));
        rptColleges.DataSource = colleges;
        rptColleges.DataBind();
    }
    protected void rptColleges_ItemDataBound(object sender, RepeaterItemEventArgs e)
    {
        if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
        {
            Repeater rptCourseNow = (e.Item.FindControl("rptCourses") as Repeater);
            rptCourseNow.DataSource = colleges[currentCollege];
            rptCourseNow.DataBind();
        }
    }

标记如下 -

   <asp:Repeater ID="rptColleges" runat="server" OnItemDataBound="rptColleges_ItemDataBound">
    <HeaderTemplate>
        <table>
    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td>
                <asp:RadioButton ID="rbCollege" runat="server" value=<%# DataBinder.Eval((KeyValuePair<string, List<string>>)Container.DataItem, "Key") %> />
                <%# currentCollege = (string)DataBinder.Eval((KeyValuePair<string, List<string>>)Container.DataItem, "Key") %>
            </td>
            <td>
                <asp:Repeater ID="rptCourses" runat="server">
                    <HeaderTemplate>
                        <ul>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <li>
                            <asp:RadioButton ID="rbCourse" value="<%#Container.DataItem %>" runat="server" />
                            &nbsp; <%#Container.DataItem %>
                        </li>
                    </ItemTemplate>
                    <FooterTemplate></ul></FooterTemplate>
                </asp:Repeater>
            </td>
        </tr>
    </ItemTemplate>
    <FooterTemplate></table></FooterTemplate>
</asp:Repeater>

谢谢您的帮助。

4

1 回答 1

0

如果我理解正确,您想将单选按钮分组到一所大学。您可以使用 RadioButton 的 GroupName 属性使单选按钮的各个部分相互排斥。

看看这个链接:

RadioButton.GroupName 属性

于 2012-09-04T02:49:41.937 回答