Assigning a cell value to NavigateUrl in GridView

Question

GridView allows to create a virtual HyperLinkField column that converts another column assigned to it (and its cell values) into hyperlinks, but NavigateUrl must be assigned a "predetermined" url address. However, in the GridView, the cells of the columns I created (Column_name) - are generated each time by running a function that creates a hyperlink address - as a relative address of the type ./(directory_with_different_name_each_time_when_the_value_is_generated)/index.aspx. Is it possible to make this content a "clickable" link to the newly generated subpage?

Answer 1

Any particular reason why say you don't just drop in a plane jane button, and use that?

create a virtual HyperLinkField column that converts another column assigned to it (and its cell values) into hyperlinks

Hum, that seems beyond confusing here??? If you asking can I create a hyper link for each row based on information from that data row that binds to the one row? Sure, no problem. You can use a messy Eval expression, but often it really OH SO MUCH easier to simple use the GV data bound event, and setup any kind of hyper link you want for that one button (or hyper link button).

I mean, we can have this gv:

        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ID"
            cssclass="table" Width="30%" OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" />
                <asp:BoundField DataField="Animal" HeaderText="Animal" />
                <asp:BoundField DataField="PictureName" HeaderText="Picture" />

                <asp:TemplateField HeaderText="Example Hyperlink" ItemStyle-HorizontalAlign="Center" >
                    <ItemTemplate>
                        <asp:HyperLink ID="HyperLink1" runat="server">View</asp:HyperLink>
                    </ItemTemplate>
                </asp:TemplateField>

                <asp:TemplateField HeaderText="Example Button" ItemStyle-HorizontalAlign="Center"  >
                    <ItemTemplate>
                        <asp:Button ID="Button1" runat="server" Text="View"  CssClass="btn" 
                            OnClick="Button1_Click"/>
                    </ItemTemplate>
                </asp:TemplateField>                         
            </Columns>
        </asp:GridView>

In above, for this demo, I dropped in a hyper link, and for good measure a plane jane button.

We will take the data FROM the data row.

I cannot beyond the mountains of Everst note how I grab the DATA source and NOT the grid view row. This allows me FULL USE of ANY and ALL columns for the data bound event. This means I do NOT even have to include the addtional columns in the grid, but ONLY IN THE DATA SOURCE!!

However, for this example, I have the columns in the gv.

So, with above, I did add a plane jane button with a button click even.

So, our code to fill the grid is this:

   protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            LoadGrid();
    }

    void LoadGrid()
    {
        using (SqlConnection conn = new SqlConnection(Properties.Settings.Default.TEST4))
        {
            using (SqlCommand cmdSQL = new SqlCommand("SELECT ID, Animal, PictureName from tblAnimals", conn))
            {
                conn.Open();
                DataTable rstData = new DataTable();
                rstData.Load(cmdSQL.ExecuteReader());
                GridView1.DataSource = rstData;
                GridView1.DataBind();
            }
        }
    }

Output:

Ok, so lets cook up a hyper ink url for each hyper link button.

And lets ALSO do this for the button click.

So, in the gv row data bind event, we now have this:

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            // get data row
            DataRowView gData = (DataRowView)e.Row.DataItem;

            // example set hyper link
            HyperLink myHyper = (HyperLink)e.Row.FindControl("HyperLink1");
            // create URL based on row data
            myHyper.NavigateUrl = "~/Content/Animals/" + gData["PictureName"];

            // example buttion click
            Button myBtn = (Button)e.Row.FindControl("Button1");
            myBtn.CommandArgument = "~/Content/Animals/" + gData["PictureName"];
        }
    }

As you can see, we are free to cook up and create ANY kind of hyper link URL in code based on the columns in the data we feed to the grid.

As noted, I also tossed in a plane jane button - it has a click even, but NOTE close how I set the command argument for that button.

And thus the button click code does this:

    protected void Button1_Click(object sender, EventArgs e)
    {
        Button btn = (Button)sender;
        Response.Redirect(btn.CommandArgument);
    }

So, both the hyper link, and the button click quite much wind up doing the same thing - navagating to a url of our choice for each row, and that url can be anything you wish to cook up in code based on the one data row.

Also, my code used SqlProvider, and you are likly using oleDB or ODBC provider, so just swap out the sqlcommand, Sqlconnection to the oleDB one, or ODBC one - the code will work much the same regardless of what provider you are using.