How to get SelectedIndexChanged event when the DropDownList is populated at client side?"

Question

I have created a simple example that calls the WebMethod using ajax post method and retrieves the data from server side. Everything is working fine except its SelectedIndexChanged event.

The error says:

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.ArgumentException: Invalid postback or callback argument. Event validation is enabled using <pages enableEventValidation="true"/> in configuration or <%@ Page EnableEventValidation="true" %> in a page. For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them. If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.

I have also read some solutions but, I don't want to use update panel and don't want to populate on server side.As the norbertB has suggested that It's a bad idea to disable eventvalidation, because you lose a little of security that come with very little cost

I know that viewstate will not get updated when I populate the dropdownlist from client side. So, what should I do to solve this issue?

My code is simple

Server Side

<Services.WebMethod>
Public Shared Function getDDL() As ArrayList
    Dim arr As New ArrayList
    arr.Add(New DDLCls(1, "Nimesh"))
    arr.Add(New DDLCls(2, "Rahul"))
    arr.Add(New DDLCls(3, "Hiren"))
    arr.Add(New DDLCls(2, "Dipak"))
    Return arr
End Function

Client Side

$.ajax({
    type: 'POST',
    url: 'Default.aspx/getDDL',
    data: '{}',
    contentType: 'application/json; charset=utf-8',
    datatype: 'json',
    success: function (data) {
        $.each(data.d, function (index, item) {
            $('#ddl').get(0).options[$('#ddl').get(0).options.length] = new Option(item.Display, item.Value);
        });
    },
    error: function (data) {
        alert('Error on web method call: ' + data);
    }
}
);

ASP.NET Code

<asp:DropDownList ID="ddl" runat="server" AutoPostBack ="true" EnableViewState="false"></asp:DropDownList>
<input type="button" id="btnDate" onclick="getDate()"  value="Get Date" />

My question is "Is it possible to get SelectedIndexChanged event when the DropDownList is populated at client side?"

Your controls are not registered to page when its loaded. you are populating dropdown items at client side so in that case you have two ways. 1) you can take one hiddenfield add value changed event to it and on the dropdown change change the value of that hiddenfield accodingly so serverside calls 2) you need to handle it through client side. add `onchange` event to it and then handle all through change method — Just code, Apr 11 '15 at 03:28
Is it possible to call any server side method using javascript on `onchange` event? — Shell, Apr 11 '15 at 12:52
as I said hiddenfield is the alternative option which can be the option. don't know its best or not — Just code, Apr 11 '15 at 14:09

How to get SelectedIndexChanged event when the DropDownList is populated at client side?"

0 Answers0