DataTable插件不适用于grdi控制器

本文介绍了DataTable插件不适用于grdi控制器的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述 29岁程序员，3月因学历无情被辞！我有一个要求，其中一个网格列应显示为第二行，我需要应用数据表搜索功能。但数据表不适合这种情况。我在chrome的控制台中收到类似Uncaught TypeError：无法读取未定义的属性'className'的错误。请任何人都可以帮我将数据表添加到asp.net的网格控制中。 < script type = text / javascript src = // ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js\"> < / script > < script type = text / javascript src = // datatables.net/download/build/jquery.dataTables.nightly.js\"> < / script > < script 类型 = text / javascript > $（document）.ready（function（）{ var yourTable = $（'＃<％=Gv.ClientID ％> '）。dataTable（{ //如果HTML表中只有三列，则此行会导致错误，因为它列出了aoColumnDefs中的四列。 aoColumnDefs：[{bSortable：false，aTargets：[0,1,2,3]}] }）; }）; < / script > < asp：GridView ID = Gv runat = server AutoGenerateColumns = false ClientIDMode = 静态 GridLines = 两者都 > < 列 > < asp：TemplateField HeaderText = 渲染引擎 > < ItemTemplate > < asp：Label ID = lblRender runat = server 文本 =' <％ #Eval（ Renderingengine）％> ; ' > < / asp：标签 > < / ItemTemplate > < / asp：TemplateField > < asp：TemplateField HeaderText = 浏览器 > < ItemTemplate > < asp：标签 ID = lblBrowser runat = server 文字 =' <％ #Eval（浏览器）％> ' > < / asp：Label > < / ItemTemplate > < / asp：TemplateField > < asp：TemplateField HeaderText = 平台 > < ItemTemplate > < asp：标签 ID = lblPlatform runat = server 文本 = ' <％ #Eval（平台）％> ' > ; < / asp：Label > ; < / ItemTemplate > < / asp：TemplateField > < asp： TemplateField HeaderText = 引擎版本 > < ItemTemplate > < asp：标签 ID = lblEngine runat = server 文本 =' <％ #Eval（ Engineversion）％> ' > < / asp：Label > < / ItemTemplate > < / asp：TemplateField > ; < asp：TemplateField HeaderText = CSS等级 > < ItemTemplate > < tr > < td colspan = 4 > < / td > < td > < asp：标签 ID = lblCss runat = server 文字 =' <％ #Bind（ CSSgrade）％> ' > < / asp：Label > < / td > < / tr > < / ItemTemplate > ; < / asp：TemplateField > < /列 > < / asp：GridView > < 表 cellspacing = 0 规则 = all border = 1 id = Gv style = border-collapse：collapse; > < thead > < tr > < th scope = col > 渲染引擎< / th > < th 范围 = col > 浏览器< / th > < th scope = col > 平台 < / th > < th 范围 = col > 引擎version < / th > < th scope = col > CSS等级< / th > < / tr > < / thead > < tbody > < tr > < td > Trident < / td > < td > < 跨度 id = lblBrowser > Internet Explorer 4.0 < / td > < td > Win 95+ < / td > < td > < / td > < td > < tr &克t; < td colspan = 4 > < / td > < td > 4 < / td > < / tr > < / td > < / tr > < tr > < td > Trident < / td > < td > Internet Explorer 5.0 < / td > < td > Win 95+ < / td > < td > C < / td > < td > < tr > < td colspan = 4 > < / td > < td > 5 < ; / span > < / td > < / tr > < / td > < / tr > < tr > < td > Trident < / td > < td > Internet Explorer 5.5 < / td > < td > Win 95+ < / td > < td > < ; / td > < td > < tr > < ; td colspan = 4 > < / td > < td > 5.5 < / td > < / tr > < / td > ; < / tr > < tr > < td > ; Trident < / td > < td > Internet Explorer 6.0 </td><td> Win 95+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 6 </td> </tr> </td> </tr><tr> <td> Gecko </td><td> Firefox 1.0 </td><td> Win 98+ / OSX.2+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 1.7 </td> </tr> </td> </tr><tr> <td> Gecko </td><td> Firefox 1.5 </td><td> Win 98+ / OSX.2+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 1.8 </td> </tr> </td> </tr> </tbody><tfoot> </tfoot> </table> 解决方案 (document).ready(function () { var yourTable =('#<%=Gv.ClientID %>').dataTable({ // If you only have three columns in the HTML table, then this line will cause an error, because it lists four columns in \"aoColumnDefs\". \"aoColumnDefs\": [{ \"bSortable\": false, \"aTargets\": [0, 1, 2, 3]}] }); }）; </script> <asp:GridView ID=\"Gv\" runat=\"server\" AutoGenerateColumns=\"false\" ClientIDMode=\"Static\" GridLines=\"Both\"> <Columns> <asp:TemplateField HeaderText=\"Rendering engine\"> <ItemTemplate> <asp:Label ID=\"lblRender\" runat=\"server\" Text='<% #Eval(\"Renderingengine\")%>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText=\"Browser\"> <ItemTemplate> <asp:Label ID=\"lblBrowser\" runat=\"server\" Text='<%#Eval(\"Browser\") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText=\"Platform\"> <ItemTemplate> <asp:Label ID=\"lblPlatform\" runat=\"server\" Text='<%#Eval(\"Platform\") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText=\"Engine version\"> <ItemTemplate> <asp:Label ID=\"lblEngine\" runat=\"server\" Text='<%#Eval(\"Engineversion\") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText=\"CSS grade\"> <ItemTemplate> <tr> <td colspan=\"4\"> </td> <td> <asp:Label ID=\"lblCss\" runat=\"server\" Text='<%#Bind(\"CSSgrade\") %>'></asp:Label> </td> </tr> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> <table cellspacing=\"0\" rules=\"all\" border=\"1\" id=\"Gv\" style=\"border-collapse:collapse;\"> <thead> <tr> <th scope=\"col\">Rendering engine</th><th scope=\"col\">Browser</th><th scope=\"col\">Platform</th><th scope=\"col\">Engine version</th><th scope=\"col\">CSS grade</th> </tr> </thead><tbody> <tr> <td> Trident </td><td> Internet Explorer 4.0 </td><td> Win 95+ $b$ b </td><td> A </td><td> <tr&g t; <td colspan=\"4\"> </td> <td> 4 </td> </tr> </td> </tr><tr> <td> Trident </td><td> Internet Explorer 5.0 </td><td> Win 95+ </td><td> C </td><td> <tr> <td colspan=\"4\"> </td> <td> 5 </td> </tr> </td> </tr><tr> <td> Trident </td><td> Internet Explorer 5.5 </td><td> Win 95+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 5.5 </td> </tr> </td> </tr><tr> <td> Trident </td><td> Internet Explorer 6.0 </td><td> Win 95+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 6 </td> </tr> </td> </tr><tr> <td> Gecko </td><td> Firefox 1.0 </td><td> Win 98+ / OSX.2+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 1.7 </td> </tr> </td> </tr><tr> <td> Gecko </td><td> Firefox 1.5 </td><td> Win 98+ / OSX.2+ </td><td> A </td><td> <tr> <td colspan=\"4\"> </td> <td> 1.8 </td> </tr> </td> </tr> </tbody><tfoot> </tfoot> </table> Hi,I have requirement where the one of the grid column should be displayed as second row and i need to apply data table search functionality.but data table is not working for this scenario. I am getting error like "Uncaught TypeError: Cannot read property 'className' of undefined " in console of the chrome. Please any one can help me to add data table to the grid controle of the asp.net.<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script type="text/javascript" src="//datatables.net/download/build/jquery.dataTables.nightly.js"></script><script type="text/javascript">$(document).ready(function () {var yourTable = $('#<%=Gv.ClientID %>').dataTable({// If you only have three columns in the HTML table, then this line will cause an error, because it lists four columns in "aoColumnDefs"."aoColumnDefs": [{ "bSortable": false, "aTargets": [0, 1, 2, 3]}]});});</script><asp:GridView ID="Gv" runat="server" AutoGenerateColumns="false" ClientIDMode="Static"GridLines="Both"><Columns><asp:TemplateField HeaderText="Rendering engine"><ItemTemplate><asp:Label ID="lblRender" runat="server" Text='<% #Eval("Renderingengine")%>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="Browser"><ItemTemplate><asp:Label ID="lblBrowser" runat="server" Text='<%#Eval("Browser") %>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="Platform"><ItemTemplate><asp:Label ID="lblPlatform" runat="server" Text='<%#Eval("Platform") %>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="Engine version"><ItemTemplate><asp:Label ID="lblEngine" runat="server" Text='<%#Eval("Engineversion") %>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="CSS grade"><ItemTemplate><tr><td colspan="4"></td><td><asp:Label ID="lblCss" runat="server" Text='<%#Bind("CSSgrade") %>'></asp:Label></td></tr></ItemTemplate></asp:TemplateField></Columns></asp:GridView><table cellspacing="0" rules="all" border="1" id="Gv" style="border-collapse:collapse;"><thead><tr><th scope="col">Rendering engine</th><th scope="col">Browser</th><th scope="col">Platform</th><th scope="col">Engine version</th><th scope="col">CSS grade</th></tr></thead><tbody><tr><td>Trident</td><td>Internet Explorer 4.0</td><td>Win 95+</td><td>A</td><td><tr><td colspan="4"></td><td>4</td></tr></td></tr><tr><td>Trident</td><td>Internet Explorer 5.0</td><td>Win 95+</td><td>C</td><td><tr><td colspan="4"></td><td>5</td></tr></td></tr><tr><td>Trident</td><td>Internet Explorer 5.5</td><td>Win 95+</td><td>A</td><td><tr><td colspan="4"></td><td>5.5</td></tr></td></tr><tr><td>Trident</td><td>Internet Explorer 6.0</td><td>Win 95+</td><td>A</td><td><tr><td colspan="4"></td><td>6</td></tr></td></tr><tr><td>Gecko</td><td>Firefox 1.0</td><td>Win 98+ / OSX.2+</td><td>A</td><td><tr><td colspan="4"></td><td>1.7</td></tr></td></tr><tr><td>Gecko</td><td>Firefox 1.5</td><td>Win 98+ / OSX.2+</td><td>A</td><td><tr><td colspan="4"></td><td>1.8</td></tr></td></tr></tbody><tfoot></tfoot></table> 解决方案 (document).ready(function () {var yourTable =('#<%=Gv.ClientID %>').dataTable({// If you only have three columns in the HTML table, then this line will cause an error, because it lists four columns in "aoColumnDefs"."aoColumnDefs": [{ "bSortable": false, "aTargets": [0, 1, 2, 3]}]});});</script><asp:GridView ID="Gv" runat="server" AutoGenerateColumns="false" ClientIDMode="Static"GridLines="Both"><Columns><asp:TemplateField HeaderText="Rendering engine"><ItemTemplate><asp:Label ID="lblRender" runat="server" Text='<% #Eval("Renderingengine")%>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="Browser"><ItemTemplate><asp:Label ID="lblBrowser" runat="server" Text='<%#Eval("Browser") %>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="Platform"><ItemTemplate><asp:Label ID="lblPlatform" runat="server" Text='<%#Eval("Platform") %>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="Engine version"><ItemTemplate><asp:Label ID="lblEngine" runat="server" Text='<%#Eval("Engineversion") %>'></asp:Label></ItemTemplate></asp:TemplateField><asp:TemplateField HeaderText="CSS grade"><ItemTemplate><tr><td colspan="4"></td><td><asp:Label ID="lblCss" runat="server" Text='<%#Bind("CSSgrade") %>'></asp:Label></td></tr></ItemTemplate></asp:TemplateField></Columns></asp:GridView><table cellspacing="0" rules="all" border="1" id="Gv" style="border-collapse:collapse;"><thead><tr><th scope="col">Rendering engine</th><th scope="col">Browser</th><th scope="col">Platform</th><th scope="col">Engine version</th><th scope="col">CSS grade</th></tr></thead><tbody><tr><td>Trident</td><td>Internet Explorer 4.0</td><td>Win 95+</td><td>A</td><td><tr><td colspan="4"></td><td>4</td></tr></td></tr><tr><td>Trident</td><td>Internet Explorer 5.0</td><td>Win 95+</td><td>C</td><td><tr><td colspan="4"></td><td>5</td></tr></td></tr><tr><td>Trident</td><td>Internet Explorer 5.5</td><td>Win 95+</td><td>A</td><td><tr><td colspan="4"></td><td>5.5</td></tr></td></tr><tr><td>Trident</td><td>Internet Explorer 6.0</td><td>Win 95+</td><td>A</td><td><tr><td colspan="4"></td><td>6</td></tr></td></tr><tr><td>Gecko</td><td>Firefox 1.0</td><td>Win 98+ / OSX.2+</td><td>A</td><td><tr><td colspan="4"></td><td>1.7</td></tr></td></tr><tr><td>Gecko</td><td>Firefox 1.5</td><td>Win 98+ / OSX.2+</td><td>A</td><td><tr><td colspan="4"></td><td>1.8</td></tr></td></tr></tbody><tfoot></tfoot></table> 这篇关于DataTable插件不适用于grdi控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！上岸，阿里云！

gv

DataTable插件不适用于grdi控制器