CODEWITHSUNDEEP
asp.net
m_t
m_t

Reputation: 1

auto postback in web custom control that have 3 binded dropdown toghether

i have 18 custom web user controls. i load web user controls in div. it work correctly and no problem on change or postback.

but i have 3 drop down list in one of custom web user controls that bind together.

for example countries , cities , streets.

in custom web user control load i fill countries. and in selected index changed of countries i fill cities . and in selected index changed of cities i fill streets.

and all of 3 drop down list are auto post back.

but in countries selected index changed worked correctly and set cities(custom web user control reload correctly).

but in cities selected index changed (custom web user control relaod again and set countries again and set cities again and reset all selections).

in this state cities drop down list forget selected item.

i use update panel in page, load controls in div that locate in page and update panel, have 3 drop down list that bind together. but can not set correctly. thanks

Upvotes: 0

Views: 144

Answers (3)

m_t
m_t

Reputation: 1

i can control this problem and solve it by use 2 item ..... without jquery

1-a lot java script 2-.net asp c#

in onchange(client event) of city drop down list, i get selected index and set one textbox that placed in master or main page by this code

*temp = document.getElementById("x17_ddclans");//x17 is id of my control
    document.getElementById("th").value= temp.selectedIndex;
//th is textbox that placed in main page*

then in form load in main page , hide th by javascript

and in textchange of textbox i set one session that contain th.text NOTE: auto post back enabled in textbox

because i use update panel , user can not see page postback.

and Finaly

in load page of control (x17): i get session and set countries normaly set city by session that contain selected value and set street

it work correctly.

Upvotes: 0

er_jack
er_jack

Reputation: 112

You could use the ajax function in jQuery:

     <asp:DropDownList ID="DropDownList1" Width="250px" AutoPostBack="true" runat="server">
     <asp:DropDownList ID="DropDownList2" Width="250px" AutoPostBack="true" runat="server">
     <asp:DropDownList ID="DropDownList3" Width="250px" AutoPostBack="true" runat="server">
     ...
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
     $(document).ready(function () {
        $("#<%= DropDownList1.ClientID %>").change(function () {
            var ddl1SelectedValue = $("#<%= DropDownList1.ClientID %> option:selected").val();
            var data2 = { "Value2": ddl1SelectedValue };
            var json2 = JSON.stringify(data2);
            $.ajax
            ({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                data: json2,
                url: "Default.aspx/BindDropDownList2",
                success: function (result2) {
                    ...
                    });                    },
                error: function (status, ex) {
                    alert("Error Code2: Status: " + status + " Ex: " + ex);
                }
            });
        });
    });

Do the same for the third DropDownList cascaded.

Upvotes: 0

Amnesh Goel
Amnesh Goel

Reputation: 2655

This is common behavior. When you are doing a post-back then at that time, of course, your drop-downs will be refreshed. So, you have to do couple of things.

  1. Maintain hidden fields. When you make a selection for either country or a city drop-down, copy your selected index (or value) in hidden field.
  2. Then on Page_Load event, in Is PostBack, fill the country drop- down, and by using hidden field value, you can set the drop-down to previously selected value. Same process you can repeat for city drop down.
    or
    perform the step 2 in SelectIndexChanged event of drop-down.

Upvotes: 0

Related Questions