I have an ASP.NET DropDownList
server control on my page Default.aspx
. I'm trying to handle the the selection change event (if using server events it was SelectedIndexChanged
event) client side and make an AJAX call back to the server (I used to use UpdatePanels a few years back but want to just use jQuery/ajax
to do this now).
I have the following simple method server side (following this example http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/):
[WebMethod]
public static void MyDDL_SelectedIndexChanged()
{
//Do some processing
}
I then have this JavaScript in the page:
<script type="text/javascript">
$(document).ready(function () {
// Add the page method call as an onclick handler for the control.
$("<%= MyDDL.ClientID %>").click(function () {
$.ajax({
type: "POST",
url: "Default.aspx/MyDDL_SelectedIndexChanged",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json"
});
});
});
</script>
Here is the server control:
<asp:DropDownList ID="MyDDL" runat="server" Width="340px" />
As it stands this does not work. No error or anything. The method is never called no matter what I do to interact with my DropDownList
.
I believe the issue is that the click
JavaScript event is not the correct one to wire up to the control. I also tried change
and that didn't work either. Basically what I want is when the selection has changed on the control, the script is called which in turn calls my server side method.
Can anyone assist on what I may be doing incorrectly?