如何通过在 C# 中使用级联下拉列表选择单选按钮列表中的单选按钮来更改下拉列表值

Question

我的 asp.net Web 应用程序中有一个单选按钮列表，其中包含两个单选按钮和一个下拉列表。我需要更改下拉列表值，以使用 Ajax 级联下拉列表在客户端选择单选按钮。任何人都可以提供解决方案吗？这意味着它将对我的项目真正有帮助。

谢谢...

Answer 1

我有一个适合类似要求的现成代码。我希望它有帮助。

解决方案： 假设有一个包含状态的 xml 文件。这是下拉列表的数据源，您需要在单击单选按钮时填充该数据源。

 <?xml version="1.0" encoding="utf-8" ?>
 <states>
 <state name="ALABAMA" abbreviation="AL" />
 <state name="ALASKA" abbreviation="AK" />
 </states>  

ASPX代码

<asp:RadioButtonList CssClass="radio" runat="server" ID="rblist">
    <asp:ListItem  Value="1">Yes</asp:ListItem>
    <asp:ListItem Value="2">No</asp:ListItem>
</asp:RadioButtonList>
<br/>
<asp:DropDownList runat="server" ID="ddlStates"/>

调用Web方法的Jquery代码

   <script type="text/javascript">

        $(document).ready(function () { 

            $("input:radio[name='rblist']").click(function () {

                var selectedRadio = $("input:radio[name='rblist']:checked").val();

                //Code to fetch complex datatype
                $.ajax({
                    type: "POST",
                    url: "/Samples.aspx/GetStatesWithAbbr",
                    dataType: "json",
                    data: "{ id :'" + selectedRadio + "'}",
                    contentType: "application/json; charset=utf-8",
                    success: function (msg) {
                        //alert(msg.d);
                        $("#ddlStates").get(0).options.length = 0;
                        $("#ddlStates").get(0).options[0] = new Option("-- Select state --", "-1");

                        $.each(msg.d, function (index, item) {
                            $("#ddlStates").get(0).options[$("#ddlStates").get(0).options.length] = new Option(item.Name, item.Abbreviation);
                        });
                    },
                    error: function () {
                        alert('error');
                    }
                });

            });

            $("#ddlStates").bind("change", function () {
                $('#' + '<%= lblSelectedState.ClientID %>').val($(this).val());
            });
        });
    </script>

WebMethod在同一页面代码后面

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public static List<State> GetStatesWithAbbr(string id)
    {
        List<State> sbStates = new List<State>();

        XmlDocument doc = new XmlDocument();
        string filePath = HttpContext.Current.Server.MapPath("~/App_Data/States.xml");
        doc.Load(filePath);

        try
        {
            foreach (XmlElement xnl in doc.DocumentElement.ChildNodes)
            {
                State st = new State();
                st.Name = xnl.Attributes["name"].Value;
                st.Abbreviation = xnl.Attributes["abbreviation"].Value;
                st.value = xnl.Attributes["name"].Value;
                sbStates.Add(st);
            }
        }
        catch (Exception ex)
        {
            string exp = ex.ToString(); //Setup a breakpoint here to verify any exceptions raised.
        }
        return sbStates;
    }

状态类

   public class State
   { 
        public string Name { get; set; }
        public string value { get; set; }
        public string Abbreviation { get; set; }
   }

解释

1. On click of radio button we call a web method defined in code
behind.
2. web method accepts radio button's selected value and returns the states.
3. State is a complex type.Returned type is json.
4. On Success returned data is populated in dropdownlist.

我假设你是熟悉Jquery。