Gridview rendered Table - remove span possible ?

Question

User-775831949 posted

The Gridview on aspx rendered a lot of <span id = ...> for many cells

How to remove these span tag on rendering ?

Please help, thanks

Answer 1

User-492460945 posted

Hello hkbeer,

Why you want to remove the span tags? Is there any special reason? Please explain what you exactly need?

Thanks,

Rajesh.

Answer 2

User-1716253493 posted

Seem like the span come from a control inside itemtemplate

For example

<asp:Label ID="Label1" runat="server" Text="Label" ></asp:Label>

<span id="Label1">Label</span>

in grid

<span id="GridView1_Label1_0">Label</span>

You can see the span id, you can determine from where the span come.

Answer 3

User-707554951 posted

Hi hkbeer

For your problem, you could replace the span tag In td with plain text by using Jquery.

  <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false" DataKeyNames="Id">
                <Columns>
                    <asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="150" />
                    <asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="100" />
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="Label1" runat="server" Text='<%#Eval("Group") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>

Code Behind:

  DataTable dt = new DataTable();
                dt.Columns.AddRange(new DataColumn[4] { new DataColumn("Id"), new DataColumn("Group"), new DataColumn("Name"), new DataColumn("Country") });
                dt.Rows.Add(1, "A", "John Hammond", "United States");
                dt.Rows.Add(2, "B", "Mudassar Khan", "India");        
                GridView2.DataSource = dt;
                GridView2.DataBind();

Output:

Working code:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#GridView2>tbody>tr").not(":first").each(function () {
                $(this).find("td:eq(2)").html($(this).find("td:eq(2)").text());
            })         
        });
    </script>

Result:

Best regards

Cathy