Ajax in asp web forms doesn't get called - asp.net

Question

I have many buttons and when the user clicks on one, I want it to update a label with ajax.
I implemented ajax in my template like so:
<form runat="server">
<asp:ScriptManager ID="ScriptManagerPull" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div runat="server" id="SiteContent">
</div>
</ContentTemplate>
</asp:UpdatePanel>
</form>
The buttons are generated dynamically;
foreach (MyDTO myDTO in List) {
Button ButtonPull = new Button();
ButtonPull.Text = "Pull";
ButtonPull.ID = articleDTO.ArticleID.ToString();
ButtonPull.ControlStyle.CssClass = "btn btn-default";
ButtonPull.Click += new EventHandler(Pull_Click);
SiteContent.Controls.Add(ButtonPull);
}
Now the problem is that the event doesn't get called when a user clicks on button. This doesn't work:
protected void Pull_Click(object sender, EventArgs e) {
// Button button = sender as Button;
LabelTest.Text = "Cool";
}
How can I do that?
Thanks.

Answer 1

I am assuming you do not simply want to call the click event but perhaps pass some data from the client to the server via AJAX. The most straightforward way to do this, without ScriptManager, UpdatePantel and all that is like this. I have created one button and it has no click event handler on the server side. But it has one on the client side.
protected void Page_Load(object sender, EventArgs e)
{
Button ButtonPull = new Button();
ButtonPull.Text = "Pull";
ButtonPull.ID = "Button1";
ButtonPull.ControlStyle.CssClass = "btn btn-default";
this.Form.Controls.Add(ButtonPull);
// You can pass anything you want to the server. Here I am passing 1111
// You can pass things from the client side as well. Whole JSON objects as well
ButtonPull.OnClientClick = "callServer(1111);return false;"; // return false so button does not postback
}
I have also added this method to my page's code behind. This is a web method which receives an id as int and appends it to a string and returns that string to the client.
[WebMethod]
[ScriptMethod(UseHttpGet = true,
ResponseFormat = ResponseFormat.Json, XmlSerializeString = false)]
public static string GetStuffFromServer(int id)
{
return "Works like a charm! And id is " + id ;
}
And finally added this to my view. When the button is clicked on the client side, it will call this function and pass 1111 as we instructed it above when we created the button. Inside this function we are using jQuery ajax call to call the server method GetSuffFromServer. If all goes well the server will return and we will go into success here and alert the data returned from the server. Again, the server can return anything needed. And this method can send anything needed to the server.
<script>
function callServer(id) {
$.ajax({
type: "GET",
contentType: "application/json; charset=utf-8",
url: "default.aspx/GetStuffFromServer?id=" + id,
success: function (data)
{
alert(data.d);
},
error: function (data) { alert(data);}
});
}
</script>
One last thing in App_Start folder's RouteConfig.cs file change this line:
settings.AutoRedirectMode = RedirectMode.Permanent;
to this:
settings.AutoRedirectMode = RedirectMode.Off;
This change is because I am using a friendly url when calling the web method: default.aspx/GetStuffFromServer?id=