Example projects are created using Visual Studio 2008 and
the project type created is Web Application.
Purpose: Calling server
side function and passing the property value.
Here is my UI code:
I have added a Grid View control of ASP.NET to display a
list of products. The columns displayed are Product Name and Description.
To display the Product Name, I have added a Link Button
control which has got text value as the Product Name. I have added one custom
property called “myCustomID” and setting the property with a value of the
Product ID.
Note: You can add as many custom properties in controls and
can access them wherever is needed though you will not see when using the
Intellisense while defining them.
I am going to add a div tag to the UI that we used in the
previous article “Calling JavaScript
function from Link Button in ASP.NET“
This is how my UI body looks
like:
We can set the value for
Command Argument for Link Button which can be accessed on the server side. We
can specify the server side method by specifying OnCommand event handler.
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="ShowProducts" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Product Name">
<ItemTemplate>
<asp:LinkButton
ID="LinkProducts"
runat="server"
CommandArgument='<%#Eval("ID")%>'
OnCommand="Product_Command"
Text='<%# Eval("Name")%>'></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Description"
HeaderText="Description"
/>
</Columns>
</asp:GridView>
</div>
<div id="displayDetails" runat="server">
<asp:Label ID="ShowDetails" runat="server"></asp:Label>
</div>
</form>
</body>
We are going to use the same
server side code with the new methods.
/// <summary>
/// Page Load Event
/// </summary>
/// <param
name="sender"></param>
/// <param
name="e"></param>
protected
void Page_Load(object
sender, EventArgs e)
{
List<Product> ProductList = new
List<Product>
{
new Product(){Name="Product1", ID="1",Description
= "Description1"},
new Product(){Name="Product2", ID="2",Description
= "Description2"},
new Product(){Name="Product3", ID="3",Description
= "Description3"}
};
ShowProducts.DataSource =
ProductList;
ShowProducts.DataBind();
}
/// <summary>
/// OnCommand Method for Link Button
/// </summary>
/// <param
name="sender"></param>
/// <param
name="e"></param>
protected
void Product_Command(Object
sender, CommandEventArgs e)
{
//Get the
Product ID from the Command Argument
String
productID = e.CommandArgument.ToString();
//Call
the method to display the selected product ID
ShowDetailsOfProduct(productID);
}
/// <summary>
/// Show the product id selected
/// </summary>
/// <param
name="productID"></param>
protected
void ShowDetailsOfProduct(string productID)
{
StringBuilder
sbreport = new StringBuilder();
sbreport.Append("<table
width='95%' border='0' cellpadding='0' cellspacing='0' align='center'>");
sbreport.Append("<tr class='tdcolbg'>");
sbreport.Append("<td>");
sbreport.Append("You have clicked :" + productID);
sbreport.Append("</td>");
sbreport.Append("</tr>");
sbreport.Append("</table>");
ShowDetails.Text =
sbreport.ToString();
}
Now run the application and
check. If you want you can put break point to understand the flow.
When you click on the Product Name Links, it should execute
Server side code and display the information in the Label control in the Div
tag.
Conclusion:
This article discusses on how to invoke server side code
when the Link Button is clicked in the ASPX file.
In my next article we would see how to execute server side function
through AJAX and jQuery. In today’s world customers mostly would like to see
the application to access the server side code from client code so that the
page will not get post back and also, can reduce the performance issues. Since,
to get some data from the server and if post back of whole page is not needed
it is always a best practice to go for AJAX.
Happy Coding!!!
No comments:
Post a Comment