Get values of hidden column for a selected row using jQuery
I have a gridview with 1 hidden column and 6 columns. I am trying to get the value of the hidden column row when the user clicks the button within the row but it does not pick up the hidden column. It gets the value of the first column which is the first visible column(FirstName).
Is there a way to get the value of the hidden column(UserID) ?
This is what I have:
C#
<asp:GridView ID="gvUsers" runat="server" AutoGenerateColumns="false" class="table table-bordered" ClientIDMode="Static" DataKeyNames="UserID, Firstname" OnRowCommand="gvUsers_RowCommand" OnRowDeleting="gvUsers_RowDeleting">
<Columns>
<asp:BoundField DataField="UserID" Visible="false" HeaderText="UserID" />
<asp:BoundField DataField="FirstName" HeaderText="First Name" />
<asp:BoundField DataField="LastName" HeaderText="Last Name" />
<asp:BoundField DataField="Username" HeaderText="Username" />
<asp:BoundField DataField="Phone" HeaderText="Cellphone Number" SortExpression="EventDescription" />
<asp:BoundField DataField="Email" HeaderText="Email" SortExpression="EventDescription" />
<asp:TemplateField HeaderText="Action">
<ItemTemplate>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
jQuery:
<script type="text/javascript">
$(function () {
$('[id*=btnTest]').on("click", function () {
var id = $(this).closest("tr").find('td:eq(0)').text();
alert(id);
return false;
});
});
</script>
Please assist how I can get the hidden column value when the button is clicked. Thank you.
javascript c# jquery asp.net
add a comment |
I have a gridview with 1 hidden column and 6 columns. I am trying to get the value of the hidden column row when the user clicks the button within the row but it does not pick up the hidden column. It gets the value of the first column which is the first visible column(FirstName).
Is there a way to get the value of the hidden column(UserID) ?
This is what I have:
C#
<asp:GridView ID="gvUsers" runat="server" AutoGenerateColumns="false" class="table table-bordered" ClientIDMode="Static" DataKeyNames="UserID, Firstname" OnRowCommand="gvUsers_RowCommand" OnRowDeleting="gvUsers_RowDeleting">
<Columns>
<asp:BoundField DataField="UserID" Visible="false" HeaderText="UserID" />
<asp:BoundField DataField="FirstName" HeaderText="First Name" />
<asp:BoundField DataField="LastName" HeaderText="Last Name" />
<asp:BoundField DataField="Username" HeaderText="Username" />
<asp:BoundField DataField="Phone" HeaderText="Cellphone Number" SortExpression="EventDescription" />
<asp:BoundField DataField="Email" HeaderText="Email" SortExpression="EventDescription" />
<asp:TemplateField HeaderText="Action">
<ItemTemplate>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
jQuery:
<script type="text/javascript">
$(function () {
$('[id*=btnTest]').on("click", function () {
var id = $(this).closest("tr").find('td:eq(0)').text();
alert(id);
return false;
});
});
</script>
Please assist how I can get the hidden column value when the button is clicked. Thank you.
javascript c# jquery asp.net
That is because the hidden column does not exist in the html. When you set a control to Visible=false it does not get rendered to the client.
– VDWWD
Nov 15 '18 at 18:41
Is there an alternative way to get the UserID?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:42
add a comment |
I have a gridview with 1 hidden column and 6 columns. I am trying to get the value of the hidden column row when the user clicks the button within the row but it does not pick up the hidden column. It gets the value of the first column which is the first visible column(FirstName).
Is there a way to get the value of the hidden column(UserID) ?
This is what I have:
C#
<asp:GridView ID="gvUsers" runat="server" AutoGenerateColumns="false" class="table table-bordered" ClientIDMode="Static" DataKeyNames="UserID, Firstname" OnRowCommand="gvUsers_RowCommand" OnRowDeleting="gvUsers_RowDeleting">
<Columns>
<asp:BoundField DataField="UserID" Visible="false" HeaderText="UserID" />
<asp:BoundField DataField="FirstName" HeaderText="First Name" />
<asp:BoundField DataField="LastName" HeaderText="Last Name" />
<asp:BoundField DataField="Username" HeaderText="Username" />
<asp:BoundField DataField="Phone" HeaderText="Cellphone Number" SortExpression="EventDescription" />
<asp:BoundField DataField="Email" HeaderText="Email" SortExpression="EventDescription" />
<asp:TemplateField HeaderText="Action">
<ItemTemplate>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
jQuery:
<script type="text/javascript">
$(function () {
$('[id*=btnTest]').on("click", function () {
var id = $(this).closest("tr").find('td:eq(0)').text();
alert(id);
return false;
});
});
</script>
Please assist how I can get the hidden column value when the button is clicked. Thank you.
javascript c# jquery asp.net
I have a gridview with 1 hidden column and 6 columns. I am trying to get the value of the hidden column row when the user clicks the button within the row but it does not pick up the hidden column. It gets the value of the first column which is the first visible column(FirstName).
Is there a way to get the value of the hidden column(UserID) ?
This is what I have:
C#
<asp:GridView ID="gvUsers" runat="server" AutoGenerateColumns="false" class="table table-bordered" ClientIDMode="Static" DataKeyNames="UserID, Firstname" OnRowCommand="gvUsers_RowCommand" OnRowDeleting="gvUsers_RowDeleting">
<Columns>
<asp:BoundField DataField="UserID" Visible="false" HeaderText="UserID" />
<asp:BoundField DataField="FirstName" HeaderText="First Name" />
<asp:BoundField DataField="LastName" HeaderText="Last Name" />
<asp:BoundField DataField="Username" HeaderText="Username" />
<asp:BoundField DataField="Phone" HeaderText="Cellphone Number" SortExpression="EventDescription" />
<asp:BoundField DataField="Email" HeaderText="Email" SortExpression="EventDescription" />
<asp:TemplateField HeaderText="Action">
<ItemTemplate>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
jQuery:
<script type="text/javascript">
$(function () {
$('[id*=btnTest]').on("click", function () {
var id = $(this).closest("tr").find('td:eq(0)').text();
alert(id);
return false;
});
});
</script>
Please assist how I can get the hidden column value when the button is clicked. Thank you.
javascript c# jquery asp.net
javascript c# jquery asp.net
asked Nov 15 '18 at 18:40
Lyubomir Ivanov ValchevLyubomir Ivanov Valchev
171116
171116
That is because the hidden column does not exist in the html. When you set a control to Visible=false it does not get rendered to the client.
– VDWWD
Nov 15 '18 at 18:41
Is there an alternative way to get the UserID?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:42
add a comment |
That is because the hidden column does not exist in the html. When you set a control to Visible=false it does not get rendered to the client.
– VDWWD
Nov 15 '18 at 18:41
Is there an alternative way to get the UserID?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:42
That is because the hidden column does not exist in the html. When you set a control to Visible=false it does not get rendered to the client.
– VDWWD
Nov 15 '18 at 18:41
That is because the hidden column does not exist in the html. When you set a control to Visible=false it does not get rendered to the client.
– VDWWD
Nov 15 '18 at 18:41
Is there an alternative way to get the UserID?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:42
Is there an alternative way to get the UserID?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:42
add a comment |
1 Answer
1
active
oldest
votes
The easiest way is to just add it to a TemplateField in an element that is hidden
<asp:TemplateField>
<ItemTemplate>
<span style="display:none"><%# Eval("UserID") %></span>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
And modify the script to
var id = $(this).closest("tr").find('span').html();
Update
As @Taplar mentioned, you can also use attributes. But you need to add those in the RowDataBound event.
if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRowView row = e.Row.DataItem as DataRowView;
e.Row.Attributes.Add("data-userid", row["userid"].ToString());
}
The script would then become
var id = $(this).closest("tr").data('userid');
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53325970%2fget-values-of-hidden-column-for-a-selected-row-using-jquery%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
The easiest way is to just add it to a TemplateField in an element that is hidden
<asp:TemplateField>
<ItemTemplate>
<span style="display:none"><%# Eval("UserID") %></span>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
And modify the script to
var id = $(this).closest("tr").find('span').html();
Update
As @Taplar mentioned, you can also use attributes. But you need to add those in the RowDataBound event.
if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRowView row = e.Row.DataItem as DataRowView;
e.Row.Attributes.Add("data-userid", row["userid"].ToString());
}
The script would then become
var id = $(this).closest("tr").data('userid');
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
add a comment |
The easiest way is to just add it to a TemplateField in an element that is hidden
<asp:TemplateField>
<ItemTemplate>
<span style="display:none"><%# Eval("UserID") %></span>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
And modify the script to
var id = $(this).closest("tr").find('span').html();
Update
As @Taplar mentioned, you can also use attributes. But you need to add those in the RowDataBound event.
if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRowView row = e.Row.DataItem as DataRowView;
e.Row.Attributes.Add("data-userid", row["userid"].ToString());
}
The script would then become
var id = $(this).closest("tr").data('userid');
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
add a comment |
The easiest way is to just add it to a TemplateField in an element that is hidden
<asp:TemplateField>
<ItemTemplate>
<span style="display:none"><%# Eval("UserID") %></span>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
And modify the script to
var id = $(this).closest("tr").find('span').html();
Update
As @Taplar mentioned, you can also use attributes. But you need to add those in the RowDataBound event.
if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRowView row = e.Row.DataItem as DataRowView;
e.Row.Attributes.Add("data-userid", row["userid"].ToString());
}
The script would then become
var id = $(this).closest("tr").data('userid');
The easiest way is to just add it to a TemplateField in an element that is hidden
<asp:TemplateField>
<ItemTemplate>
<span style="display:none"><%# Eval("UserID") %></span>
<asp:Button ID="btnTest" runat="server" Text="Button" />
</ItemTemplate>
</asp:TemplateField>
And modify the script to
var id = $(this).closest("tr").find('span').html();
Update
As @Taplar mentioned, you can also use attributes. But you need to add those in the RowDataBound event.
if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRowView row = e.Row.DataItem as DataRowView;
e.Row.Attributes.Add("data-userid", row["userid"].ToString());
}
The script would then become
var id = $(this).closest("tr").data('userid');
edited Nov 15 '18 at 19:00
answered Nov 15 '18 at 18:45
VDWWDVDWWD
24.4k123756
24.4k123756
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
add a comment |
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
Perfect. Thank you! Just so I know, what if I have 2 or more hidden TemplateFields? How do I get the value for each span TemplateFields?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:50
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, yes it does. But you need to add a method for that with the RowDataBound event. I can add it if you want...
– VDWWD
Nov 15 '18 at 18:57
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
@Taplar, you are right. It is easier and cleaner with attibutes. Updated my answer,
– VDWWD
Nov 15 '18 at 19:01
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
Thank you for this
– Lyubomir Ivanov Valchev
Nov 15 '18 at 19:05
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53325970%2fget-values-of-hidden-column-for-a-selected-row-using-jquery%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
That is because the hidden column does not exist in the html. When you set a control to Visible=false it does not get rendered to the client.
– VDWWD
Nov 15 '18 at 18:41
Is there an alternative way to get the UserID?
– Lyubomir Ivanov Valchev
Nov 15 '18 at 18:42