Как изменить значения раскрывающегося списка, выбрав переключатель в списке переключателей, используя раскрывающийся список в C # - PullRequest
0 голосов
/ 08 февраля 2012

У меня есть один список радио-кнопок с двумя переключателями и один выпадающий список в моем веб-приложении asp.net. Мне нужно изменить значения раскрывающегося списка в отношении выбора переключателей на стороне клиента с помощью раскрывающегося списка Ajax Cascading. Может ли кто-нибудь предложить решения для этого, значит, это действительно поможет моему проекту.

Спасибо ...

1 Ответ

0 голосов
/ 08 февраля 2012

У меня есть готовый код для аналогичного требования.я надеюсь, что это поможет.

Решение: Допустим, существует 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"/>

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;
    }

State Class

   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.

...