+- 0Day Forums (https://zeroday.vip)
+-- Forum: Coding (https://zeroday.vip/Forum-Coding)
+--- Forum: Asp.Net (https://zeroday.vip/Forum-Asp-Net)
+--- Thread: How do I add a CSS class to a BoundField, so I can find it with jQuery? (/Thread-How-do-I-add-a-CSS-class-to-a-BoundField-so-I-can-find-it-with-jQuery)
How do I add a CSS class to a BoundField, so I can find it with jQuery? - myxinidae16607 - 07-23-2023
I want to add a class name to some of my BoundFields in the GridView control; so that once the GridView is data-bound and rendered I can obtain something like:
<td class="Tag1">Some data came from data source</td>
The purpose of doing such a thing is to be able to find all the <td> elements that are "Tag1" in this way:
var allTag1td = $('td.Tag1');
So, how can I add this class to the BoundField so that it is rendered in this way?
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - babaraoaqdqcbt - 07-23-2023
I've done someting like this in the RowCreated_Event. I had to style the cells according to they values.
[To see links please register here]
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - freewheeling970 - 07-23-2023
You can set a row's cell `CssClass` property to `Tag1` when the row's created (`RowCreated` event).
*Page.aspx*:
<asp:GridView OnRowCreated="grid_RowCreated" AutoGenerateColumns="true" runat="server" ID="grid"></asp:GridView>
Code-behind file, *Page.aspx.cs*:
protected void grid_RowCreated(object sender, GridViewRowEventArgs e) {
foreach (TableCell cell in e.Row.Cells)
cell.CssClass = "Tag1";
}
The code will set the `class` attribute of each `td` in your table to `Tag1`; the markup of the rendered page will look like the one you're looking for:
<td class="Tag1"></td>
<td class="Tag1"></td>
...
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - sandaled954094 - 07-23-2023
Add the ItemStyle property to your field:<br/>
<asp:BoundField DataField="Count" HeaderText="Count">
<ItemStyle CssClass="yourclass"></ItemStyle>
</asp:BoundField>
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - erikaxzl - 07-23-2023
Make sure to set the `ItemStyle` CssClass property rather than one of the others. I made the mistake of setting the `ControlStyle` CssClass property and it wasn't until I read this post that I realized my mistake.
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - biliofsyzygwlc - 07-23-2023
my answer
`<asp:BoundField DataField="id" HeaderText="" SortExpression="id">
<ItemStyle Width="10%" CssClass="hide"/>
<headerstyle CssClass="hide"> </headerstyle>
</asp:BoundField>`
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - merrel36 - 07-23-2023
You can convert to TemplateField then use a Label and Add any style you want.
`<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("Field") %>' CssClass="YourStyle" />
</ItemTemplate>
</asp:TemplateField>`
OR
` <asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("Field") %>' Style="line-height: 1.4" />
</ItemTemplate>
</asp:TemplateField>`
It works for me.
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - hankcxygqnphgl - 07-23-2023
For adding a boundfield in code behind (this is VB, but similar for C#) try:
bf = New BoundField()
bf.DataField = "FieldName"
bf.HeaderText = "Header"
bf.SortExpression = "FieldName(could be different)"
bf.ItemStyle.CssClass = "NoWrap"
MyGrid.Columns.Add(bf)
If you want to make CssClass data dependent you would need a templatefield Eg:
tf = New WebControls.TemplateField()
tf.HeaderText = "Whatever"
tf.SortExpression = "Whatever"
tf.ItemTemplate = New MyItemTemplate("DataField", "CssDataField")
AssessmentGrid.Columns.Add(tf)
MyItemTemplate implements ITemplate in the App_Code folder E.g:
Imports Microsoft.VisualBasic
Public Class MyItemTemplate
Implements System.Web.UI.ITemplate
'Normally Template type would be in here but we are only do Item
'(no edit, delete or header etc)
Dim DataField1 As String 'Displayed data
Dim DataField2 As String 'CssClass
Sub New(ByVal Field1 As String, ByVal Field2 As String)
DataField1 = Field1
DataField2 = Field2
End Sub
Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) _
Implements System.Web.UI.ITemplate.InstantiateIn
Dim ml As New Label()
ml.ID = DataField1
ml.Text = ""
ml.CssClass = ""
AddHandler ml.DataBinding, New EventHandler(AddressOf Item_DataBinding)
container.Controls.Add(l)
End Sub
Protected Sub Item_DataBinding(ByVal sender As Control, ByVal e As System.EventArgs)
Dim bound_value_object As Object
Dim data_item_container As IDataItemContainer = sender.NamingContainer
Dim Parent As TableCell = sender.Parent
Dim l As Label = sender
bound_value_object = DataBinder.Eval(data_item_container.DataItem, DataField1)
l.Text = bound_value_object.ToString
bound_value_object = DataBinder.Eval(data_item_container.DataItem, DataField2)
Parent.CssClass = bound_value_object.ToString
End Sub
End Class
You could apply CssClass to the label direct, but original question had it on the cell
RE: How do I add a CSS class to a BoundField, so I can find it with jQuery? - osteoclasis823 - 07-23-2023
Can you not directly set the itemstyle property of your boundfield in the aspx?
(TableItemstyle has a CssClass property)
<asp:BoundField ItemStyle-CssClass="Tag1"/>
See:
-
[To see links please register here]
-[To see links please register here]