CODEWITHSUNDEEP
asp.netonclickgridviewheader
Rafiqul Islam Parvez
Rafiqul Islam Parvez

Reputation: 15

How can I get gridview header text value as a string by click any gridview cell

I have a dynamic GridView1 where header is different date. When a user click to a cell I need header text value to find the date details in my sql database.

GridView1 like:

LineName 05-28-21 05-29-21 05-30-21

L1 Style-1 Style-2 Style-3

L2 ab ad ak

If any idea please share. I am hanging on there from some days.

Upvotes: -1

Views: 238

Answers (1)

Albert D. Kallal
Albert D. Kallal

Reputation: 49214

Hum, ok, we assume this markup:

        <asp:GridView ID="GridView1" runat="server">
        </asp:GridView>

        <asp:Button ID="cmdHeadClick" runat="server" Text="Headder fun" 
            ClientIDMode="Static" style="display:none" />

        <asp:HiddenField ID="HeadClickValue" runat="server" ClientIDMode="Static" />

        <script>
            function GetHeaderText(hText) {
                $('#HeadClickValue').val(hText)
                $('#cmdHeadClick').click()
            }
        </script>

The code to fill this grid would be this:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    If IsPostBack = False Then
        LoadGrid()
    End If

End Sub


Sub LoadGrid()

    Using cmdSQL As New SqlCommand("SELECT TOP 20 ID, HotelName, City from tblHotels",
                    New SqlConnection(My.Settings.TEST3))

        cmdSQL.Connection.Open()
        GridView1.DataSource = cmdSQL.ExecuteReader
        GridView1.DataBind()

    End Using


End Sub

Protected Sub GridView1_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowDataBound

    If e.Row.RowType = DataControlRowType.Header Then

        For Each MyCell As DataControlFieldCell In e.Row.Cells
            MyCell.Attributes.Add("onclick", "GetHeaderText('" & MyCell.Text & "')")
        Next

    End If

End Sub

Protected Sub cmdHeadClick_Click(sender As Object, e As EventArgs) Handles cmdHeadClick.Click

    Debug.Print("header text = " & HeadClickValue.Value)

End Sub

so the output looks like this:

enter image description here

An clicking on say hotel name in header outputs this:

enter image description here

Now I wired up a server side click event with above. But you can see that we do a simple data bind of the grid (data from sql server).

But, on RowDataBound event, we simple "inject" a click event for JavaScript code to run, and it passes the header cell text.

So, the JavaScript code now has the cell text value. At that point? Well, I shove the text into that hidden field, and THEN I click on my hidden button to run a server side click event that can now grab/get/use the text value of the header cell clicked.

Upvotes: 0

Related Questions