专栏首页c#开发者Pass Multiple Values from a GridView to Another Page using ASP.NET

Pass Multiple Values from a GridView to Another Page using ASP.NET

Pass Multiple Values from a GridView to Another Page  using ASP.NET

A common requirement in our projects is to select a GridView row and pass multiple values of the selected row to another page. I recently got a request from a few readers who wanted an article on this. In this article, we will explore how simple it is to achieve this requirement.

I assume you have some basic understanding of the GridView and how to bind it to a Data Source control. The Hyperlink control added to the GridView makes it quiet easy to select a row and send single/multiple values to a different page through the URL. Let us see how:

Step 1: Create a new ASP.NET website. Drag and drop a SqlDataSource Control to the page and use the wizard to connect to the Northwind database. Select the CustomerId, CompanyName, ContactName, Address and City from the Customers table. The wizard will also prompt you to save the connection string in the web.config file. Choose to do so. The design code will look similar to the following:

 <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
 SelectCommand="SELECT [CustomerID], [CompanyName], [ContactName], [Address], [City] FROM [Customers]">
 </asp:SqlDataSource>
An entry will be added to the web.config file as shown below:
      <connectionStrings>
            <add name="NorthwindConnectionString" connectionString="Data Source=(local);Initial Catalog=Northwind;Integrated Security=True"providerName="System.Data.SqlClient"/>
      </connectionStrings>

Step 2: Now add a GridView control to the page and using the smart tag, select the DataSource to be SqlDataSource1 in the GridView tasks panel. Using the same panel, click on the Enable Paging and Enable Sorting checkboxes. The source will look similar to the following. Observe that the DataKeyNames is set to ‘CustomerId’, that is the primary key of the Customers table.

 <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CustomerID"
 DataSourceID="SqlDataSource1" AllowPaging="True" AllowSorting="True">
 <Columns> 
 <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" SortExpression="CustomerID" />
 <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />
 <asp:BoundField DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" />
 <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Address" />
 <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />
 </Columns>
 </asp:GridView>

Step 3: We will now add another page in our project. In the Solution Explorer, right click the project > Add New Item > Web Form > Rename it to ‘CustomerDetails.aspx’.

Step 4: Go back to Default.aspx and add two hyperlink fields. We will see how to pass a single value as well as multiple values using the two hyperlink fields.

Single Value:

Add the following hyperlink control after the <Columns> tag in the GridView as shown below:

<Columns>
<asp:HyperLinkField DataNavigateUrlFields="CustomerID" DataNavigateUrlFormatString="CustomerDetails.aspx?CID={0}" Text="Pass Single Value" />

Multiple Values:

Just below the first hyperlink field, add another hyperlink field as shown below:

<asp:HyperLinkField DataNavigateUrlFields="CustomerID, CompanyName, ContactName, Address, City" DataNavigateUrlFormatString="CustomerDetails.aspx?CID={0}&CName={1}&ContactName={2}&Addr={3}&City={4}" Text="Pass Multiple Values" />

In the source code shown above, we are using the hyperlink field and setting some properties that will make it extremely easy to pass values to a different page. The 'DataNavigateUrlFields' sets the names of the fields, that is to be used to construct the URL  in the HyperLinkField. In the first hyperlink, since we are passing only a single value, the DataNavigateUrlFields contains only CustomerID. However in the second hyperlink, since there are multiple values to be passed, DataNavigateUrlFields contains all the names of the fields that are to be passed as query string to CustomerDetails.aspx

Similarly, the 'DataNavigateUrlFormatString' sets the string that specifies the format in which the URL is to be created. The 'Text' property represents the text that will be displayed to the user. The entire source code will look similar to the following:

<body>
 <form id="form1" runat="server">
 <div>
 <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
 SelectCommand="SELECT [CustomerID], [CompanyName], [ContactName], [Address], [City] FROM [Customers]">
 </asp:SqlDataSource>
 </div>
 <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CustomerID"
 DataSourceID="SqlDataSource1" AllowPaging="True" AllowSorting="True">
 <Columns> 
 <asp:HyperLinkField DataNavigateUrlFields="CustomerID" 
 DataNavigateUrlFormatString="CustomerDetails.aspx?CID={0}"
 Text="Pass Single Value" />
 <asp:HyperLinkField DataNavigateUrlFields="CustomerID, CompanyName, ContactName, Address, City" 
 DataNavigateUrlFormatString="CustomerDetails.aspx?CID={0}&CName={1}&ContactName={2}&Addr={3}&City={4}"
 Text="Pass Multiple Values" />
 <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" SortExpression="CustomerID" />
 <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />
 <asp:BoundField DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" />
 <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Address" />
 <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />
 </Columns>
 </asp:GridView>
 </form>
</body>

Step 5: The last step is to retrieve the query string variables from the URL in the CustomerDetails.aspx page. Add the following code for that:

C#

 protected void Page_Load(object sender, EventArgs e)
    {
 string cid = Request.QueryString["CID"];
 string cname = Request.QueryString["CName"];
 string contactName = Request.QueryString["ContactName"];
 string address = Request.QueryString["Addr"];
 string city = Request.QueryString["City"];
    }
VB.NET
 Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
 Dim cid As String = Request.QueryString("CID")
 Dim cname As String = Request.QueryString("CName")
 Dim contactName As String = Request.QueryString("ContactName")
 Dim address As String = Request.QueryString("Addr")
 Dim city As String = Request.QueryString("City")
 End Sub

Set a breakpoint at the Page_Load method of the CustomerDetails.aspx. Run the application and click on either the ‘Pass Single Value’ or ‘Pass Multiple Values’ hyperlink to pass values to the CustomerDetails.aspx page. Using the breakpoint, observe the values of the selected row being passed to the CustomerDetails page.

I hope this article was useful and I thank you for viewing it.

If you liked the article

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 解决:TF30170: Microsoft.ProjectCreationWizard.WorkItemTracking

    Error TF30170: The plugin Microsoft.ProjectCreationWizard.WorkItemTracking fail...

    阿新
  • Add a FileUpload control to your GridView [转]

    Add a FileUpload control to your GridView Category:  ASP.Net 2.0 ...

    阿新
  • XML Encryption in .Net

    XML Encryption in .Net One of the new features being introduced with the Whidbey...

    阿新
  • Kubernetes GC in v1.3

    本文是对kubernetes GC proposal的解读分析,是对GC in kubernetes v1.3的内部结构剖析,并记录了其中一些关键点,以便日后能...

    Walton
  • 操作系统 Interrupt 执行的具体步骤

    本文内容主要摘抄于 Intel® 64 and IA-32 Architectures Software Developer's Manual,其详细介绍了 i...

    wangyuntao
  • Evaluating the linear regression model评估线性回归模型

    In this recipe, we'll look at how well our regression fits the underlying data. ...

    到不了的都叫做远方
  • Linux下shell显示用户名和主机名

    版权声明:博客文章都是作者辛苦整理的,转载请注明出处,谢谢! https://blog.cs...

    Tyan
  • FreeHttp (a fiddler add in to temper the http)

    FreeHttp is a Fiddler plugin. With FreeHttp you can modify the request or respon...

    lulianqi
  • Feature selection特征选择

    This recipe along with the two following it will be centered around automatic fe...

    到不了的都叫做远方
  • 论综合 | 是什么让一个数字前端实现硅农开始学习Floorplan 的?

    如题,是什么让一个数字前端实现硅农开始学习Floorplan 的?是制造工艺的进步,是实现方法学的被迫更新,是养家糊口生的本能,正可谓:头发落完终不悔,为伊消得...

    老秃胖驴

扫码关注云+社区

领取腾讯云代金券