Fill ASP.Net dropdownlist using jQuery from Java Script and Set selectedtext after jQuery populated dropdownlist



In my application I have requirement to fill drop down using Jquery AJAX. User will not get any postback and drop down bind
smoothly.

In my dropdown, ID and text are same. for different ID and text you have to modify code little bit.



$.ajax({
                    type: "POST",
                    url: "EntityObject.aspx/GetValues",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    data: "{'ID':'" + ID + "'}",
                    success: function (result) {

                        document.getElementById('<%= dropdown.ClientID %>').options.length = 0;

                        $.each(result.d, function (key, value) {
                            $('#<%=dropdown.ClientID%>').append($("<option></option>").val(value).html(value));
                        });

//set Text in filled dropdownlist.
for (var i = 0; i < document.getElementById('<%= dropdown.ClientID %>').options.length; i++) 
{
    if (document.getElementById('<%= dropdown.ClientID %>').options[i].text == selectedtext) {
          document.getElementById('<%= dropdown.ClientID %>').options[i].selected = true;
          return;
         }
}                

                    },
                    error: function (xhr, status, error) {
                        alert("Error in DropDown Fill.");

                    }
                });



Below method will come in .cs page.


[WebMethod(EnableSession = true)]
        public static List<string> GetValues(Guid searchObjectID)
        {
            List<string> list = new List<string>();
        //Logic to fill List
            return list;
        }



Posted in | 0 comments

Jquery DatePicker is not working after partial postback.

Hello,

Sometimes after partial post back, datepicker do not work as accepted.

The problem is we require to re-initialize it after partial post back is completed.

In my application I have solved above problem by below code.


Sys.WebForms.PageRequestManager.getInstance().add_endRequest event
"Raised after an asynchronous postback is finished and control has been returned to the browser."


 $(document).ready(function() {
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

            function EndRequestHandler(sender, args) {
                  $(".date-picker").datepicker({
                            changeMonth: true,
                            changeYear: true,
                            showButtonPanel: true,
                            showOtherMonths: true,
                            selectOtherMonths: true
                        });

            }


Above solution is work fine for me. However I have observed there are many other problem for this.solution may different in that case.


Posted in | 0 comments