Question

我正在尝试在asp.net网格视图上应用Datatables js。问题是我有大量的专栏。当列数很大时，它不会正确地呈现css。此外，标题上看不到显示排序的箭头。

请查看截图。 enter image description here

请建议我解决此问题，以便为分页和搜索提供适当的控件。

 <asp:GridView ID="gvReport" runat="server" ClientIDMode="Static" CssClass="table table-bordered table-hover"
            GridLines="None" AutoGenerateColumns="false" OnPreRender="gvReport_PreRender" Width="100%">
            <Columns>
                <asp:TemplateField>
                    <ItemTemplate>
                        <a class="fancybox" href='<%#string.Format("/Images/PRODUCT/{0}",Eval("ProdImagePath")) %>'>
                            <img src="Content/images/Image.png" height="20" width="20" /></a>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField>
                    <ItemTemplate>
                        <img src="Content/images/View.png" style="cursor: pointer;"
                            onclick="OpenModalPopUp('<%#string.Format("/Images/PAGE/{0}",Eval("PageImagePath")) %>','<%#string.Format("/Images/PRODUCT/{0}",Eval("ProdImagePath")) %>')" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField>
                    <ItemTemplate>
                        <a class="fancybox" href='<%#string.Format("/Images/PAGE/{0}",Eval("PageImagePath")) %>'>
                            <img src="Content/images/Page.png" /></a>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField HeaderText="Account" DataField="account" />
                <asp:BoundField HeaderText="Period" DataField="period" DataFormatString="{0:d}" />
                <asp:BoundField HeaderText="End Date" DataField="end_date" DataFormatString="{0:d}" />
                <asp:BoundField HeaderText="Start Date" DataField="start_date" DataFormatString="{0:d}" />
                <asp:BoundField HeaderText="Days" DataField="number_of_days" />

                <asp:BoundField HeaderText="Collection" DataField="collection_type" />
                <asp:BoundField HeaderText="Week" DataField="weeks" />
                <asp:BoundField HeaderText="Category" DataField="Category" />
                <asp:BoundField HeaderText="Market" DataField="Market" />
                <asp:BoundField HeaderText="Brand" DataField="Brand" />
                <asp:BoundField HeaderText="Size" DataField="Size" />
                <asp:BoundField HeaderText="Pur_Qty" DataField="Pur_Qty" />
                <asp:BoundField HeaderText="Description" DataField="Product_Description" />
                <asp:BoundField HeaderText="Sale Price" DataField="Sale_Price" />
                <asp:BoundField HeaderText="Reg. Price (Low)" DataField="Reg_Price_Low" />
                <asp:BoundField HeaderText="Unit Price Sale" DataField="Unit_Price_Sale" />
                <asp:BoundField HeaderText="NOR Price" DataField="NOR_Price" />
                <asp:BoundField HeaderText="% OFF" DataField="percente_off" />
                <asp:BoundField HeaderText="Reg. Price High" DataField="Reg_Price_High" />
                <asp:BoundField HeaderText="Retail Coupon" DataField="Retail_Coupon" />
                <asp:BoundField HeaderText="Mfr Coupon" DataField="Mfr_Coupon" />
                <asp:BoundField HeaderText="Limit" DataField="Limit" />
                <asp:BoundField HeaderText="Events" DataField="Events" />
                <asp:BoundField HeaderText="Save Up To" DataField="Save_Up_To" />
                <asp:BoundField HeaderText="Ad Type" DataField="Ad_Type" />
                <asp:BoundField HeaderText="Theme" DataField="Theme" />
                <asp:BoundField HeaderText="Offer Desc" DataField="Offer_Description" />
                <asp:BoundField HeaderText="Page Position" DataField="Page_Position" />
                <asp:BoundField HeaderText="Promotions" DataField="Promotions" />
                <asp:BoundField HeaderText="Manufacturer" DataField="Manufacturer" />
                <asp:BoundField HeaderText="Retailer Points" DataField="Retailer_Points" />
                <asp:BoundField HeaderText="Week Month" DataField="Week_Month" />
                <asp:BoundField HeaderText="Master Brand" DataField="Master_Brand" />
                <asp:BoundField HeaderText="Year" DataField="Year" />
                <asp:BoundField HeaderText="Brand_Family" DataField="Brand_Family" />
                <asp:BoundField HeaderText="Region" DataField="Region" />
                <asp:BoundField HeaderText="Size Segmentation" DataField="Size_Segmentation" />
            </Columns>
        </asp:GridView>

数据表js：

  $("#gvReport").DataTable({ "iDisplayLength": 100, "scrollX": true });

Answer 1

如果遇到任何人遇到这种情况，这个解决方案对我有用。

当我正在研究.Net Application时，我创建了数据表js和css的捆绑包。当我尝试使用bundle包含css时，文件在页面呈现时不会被包含。（从firebug网络标签了解）。我尝试在aspx页面上以传统方式包含该文件，并且它运行良好。

不确定为什么捆绑的东西对我不起作用。

希望这有助于某人。

由于

数据表js格式未正确应用

1 个答案: