locked
Problem with jQuery Chosen dropdown list RRS feed

  • Question

  • User194385433 posted
     
    Hi,
    
    Problem with jQuery Chosen dropdown list.
    
    I am binding dropdownlist "ddlrec" on page load.
    
    
    When i am selecting first time dropdown "ddlRec" it's loading and binding candidates to the ddlCandidateName.
    
    If again I am changing dropdown list ddlRec then It's adding 2 DropDown for ddlCandidateName.
    
    Why It's adding 2 Dropdowns.
    
    
     <asp:DropDownList ID="ddlRec" class="chzn-select" Style="width: 180px;" runat="server" />
    
     <asp:DropDownList ID="ddlCandidateName"  Style="width: 250px;" runat="server" />
    
    On Serrver Side I am binding ddlRec:
    
     if (!Page.IsPostBack)
                {
    
                    InitializeRec(ddlRec);
                   
    
                }
    
    
      private void InitializeRec(DropDownList UserNameddl)
        {
    
            DataTable dtbl = new DataTable();
    
            dtbl = GetAllUsers();
    
            if (!StDbUtil.IsDataTableEmpty(dtbl))
            {
                UserNameddl.Items.Clear();
                UserNameddl.Items.Add(new ListItem("Please Select Rec", "0"));
                DataView dv = new DataView(dtbl);
                dv.Sort = "up_first_name";
                foreach (DataRowView drv in dv)
                    UserNameddl.Items.Add(new ListItem(drv[3].ToString() + " " + drv[4].ToString(), drv[1].ToString().ToUpper()));
    
            }
    
    
    
        }
    
    
    function getRec() {
                $("#<%=ddlRec.ClientID %>").change(function () {
    
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "CreateCRF.aspx/GetRecEmailId",
                        data: "{'userName':'" + $("#<%=pnlSC_ddlRec.ClientID %>").val() + "'}",
                        dataType: "json",
                        success: function (data) {
                           
                             bindCandidates();
                        },
                        error: function (response) {
                            alert(response.responseText);
                        },
                        failure: function (response) {
                            alert(response.responseText);
                        }
                    });
                  
    
                });
    
            }
    
    
    function bindCandidates() {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "Create.aspx/BindCand",
                    data: "{'Recuriter':'" + $("#<%=ddlRec.ClientID %>").val() + "'}",
                    dataType: "json",
                    success: function (msg) {
                        // debugger;
                        $("#ddlCandidateName option").remove();
    
                       
    
                        var j = msg.length;
                        $("#ddlCandidateName").append($("<option></option>").val(0).html("Please Select Candidate"));
                        for (var i = 0; i < j; i++) {
                            $("#ddlCandidateName").append($("<option></option>").val(msg[i].CId).html(msg[i].CName));
                        }
    
                        $("#ddlCandidateName").show();
    
                        $('#ddlCandidateName').chosen().change();
                        $('#ddlCandidateName').trigger('liszt:updated');
                       
    
                    },
                    error: function (data) {
                        alert(data.toString());
                    }
                });
            }
    

    Thanks

    Monday, June 6, 2016 11:44 PM

Answers

  • User194385433 posted

    Hi Fei,

    I checked the Problem is here:

     $("#ddlCandidateName").show();

    - If we remove the above show() function it's working Fine.

    Thanks,

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 15, 2016 10:12 PM

All replies

  • User61956409 posted

    Hi sureshtalla,

    If again I am changing dropdown list ddlRec then It's adding 2 DropDown for ddlCandidateName.

    success: function (msg) {

    Firstly, please debug your code to check the returned value “msg” of your AJAX request and trace the process of creating dynamic options.

    Secondly, you could try to comment out the following code snippets and test if same issue will appear.

    $('#ddlCandidateName').chosen().change();

    $('#ddlCandidateName').trigger('liszt:updated');

    Best Regards,

    Fei Han

    Tuesday, June 7, 2016 2:42 AM
  • User194385433 posted

    Hi Fei,

    I checked the Problem is here:

     $("#ddlCandidateName").show();

    - If we remove the above show() function it's working Fine.

    Thanks,

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 15, 2016 10:12 PM