Question

我想通过gridview数据创建一个表，但jQuery代码需要<th>，这在gridview中没有定义，我想用转发器添加它。
这是我的代码

<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="gdSource" runat="server" AutoGenerateColumns="False" OnPreRender="gdSource_PreRender" Width="202px">
                <Columns>
                    <asp:TemplateField HeaderText="EmployeeID">
                        <EditItemTemplate>
                            <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("EmployeeName") %>'></asp:TextBox>
                        </EditItemTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label2" runat="server" Text='<%# Bind("EmployeeID") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="January">
                        <EditItemTemplate>
                            <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("January") %>'></asp:TextBox>
                        </EditItemTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label2" runat="server" Text='<%# Bind("January") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Febrarury">
                        <EditItemTemplate>
                            <asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("Febrarury") %>'></asp:TextBox>
                        </EditItemTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label3" runat="server" Text='<%# Bind("Febrarury") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="March">
                        <EditItemTemplate>
                            <asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("March") %>'></asp:TextBox>
                        </EditItemTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label4" runat="server" Text='<%# Bind("March") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <div id="target">
            </div>
            <script type="text/javascript">
                $(document).ready(function () {
                    $('#<%=gdSource.ClientID%>').tableBarChart('#target', '', false);
                });
            </script>
        </div>
    </form>
</body>
<link href="TableBarChart.css" rel="stylesheet" />
<script src="Scripts/WebForms/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="Scripts/WebForms/TableBarCharts.js"></script>

这是我的jQuery文件。

html中有一个代码，我想使用转发器在gridview中创建。

<table cellspacing="0" rules="all" border="1" id="gdSource" style="border-collapse: collapse;">
    <caption>Employee Record</caption>
    <thead>
        <tr>
            <th scope="col">EmployeeID</th>
            <th scope="col">January</th>
            <th scope="col">Febrarury</th>
            <th scope="col">March</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>
                <span id="gdSource_Label2_0">1</span>
            </th>
            <td>
                <span id="Span1">200</span>
            </td>
            <td>
                <span id="gdSource_Label3_0">100</span>
            </td>
            <td>
                <span id="gdSource_Label4_0">300</span>
            </td>
        </tr>
        <tr>
            <th>
                <span id="gdSource_Label2_1">2</span>
            </th>
            <td>
                <span id="Span2">100</span>
            </td>
            <td>
                <span id="gdSource_Label3_1">200</span>
            </td>
            <td>
                <span id="gdSource_Label4_1">200</span>
            </td>
        </tr>
    </tbody>
</table>
</div>
<div id="target"> </div>                        
<script type="text/javascript">
    $(document).ready(function () {
        $('#gdSource').tableBarChart('#target', '', true);
    });
</script>
</div>
</form>

我想使用Repeater plz帮助在griview的html页面中创建<th>。

Answer 1

尝试在模板字段中使用标题模板：

<asp:TemplateField>
    <HeaderTemplate> EmployeeID </HeaderTemplate>
    <ItemTemplate> YOUR_CONTROLS </ItemTemplate>
    <EditItemTemplate> YOUR_CONTROLS </EditItemTemplate>
</asp:TemplateField>

Answer 2

如果您打算使用转发器控件，那么格式化表格中的重要内容。你可以很容易地格式化。像这样：- `

<asp:Repeater ID="repBanner" runat="server">
        <HeaderTemplate>
            <table>
<tr>
<th>Name</th>
<th>Email</th>
</tr>
</table>
        </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td>
                    <asp:Label runat="server" Text="XYZ" ID="lblName" />
                </td>
                <td>
                     <asp:Label runat="server" Text="Email@gmail.com" ID="lblEmail" />
                </td>
            </tr>
        </ItemTemplate>
    </asp:Repeater>

`

如何添加转发器以获取网格视图

2 个答案: