Santosh Kumar

Santosh Kumar

  • NA
  • 126
  • 58.4k

DataTable Plug in Is not working for the grdi controle

Jul 22 2013 2:36 AM
Hi Every One, 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.

---------This Is ASp Code------------------------ <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>




-------------After Rendering------------------------   <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> <span id="lblRender">Trident</span> </td><td> <span id="lblBrowser">Internet Explorer 4.0</span> </td><td> <span id="lblPlatform">Win 95+</span> </td><td> <span id="lblEngine">A</span> </td><td> <tr> <td colspan="4"> </td> <td> <span id="lblCss">4</span> </td> </tr> </td> </tr><tr> <td> <span id="lblRender">Trident</span> </td><td> <span id="lblBrowser">Internet Explorer 5.0</span> </td><td> <span id="lblPlatform">Win 95+</span> </td><td> <span id="lblEngine">C</span> </td><td> <tr> <td colspan="4"> </td> <td> <span id="lblCss">5</span> </td> </tr> </td> </tr><tr> <td> <span id="lblRender">Trident</span> </td><td> <span id="lblBrowser">Internet Explorer 5.5</span> </td><td> <span id="lblPlatform">Win 95+</span> </td><td> <span id="lblEngine">A</span> </td><td> <tr> <td colspan="4"> </td> <td> <span id="lblCss">5.5</span> </td> </tr> </td> </tr><tr> <td> <span id="lblRender">Trident</span> </td><td> <span id="lblBrowser">Internet Explorer 6.0</span> </td><td> <span id="lblPlatform">Win 95+</span> </td><td> <span id="lblEngine">A</span> </td><td> <tr> <td colspan="4"> </td> <td> <span id="lblCss">6</span> </td> </tr> </td> </tr><tr> <td> <span id="lblRender">Gecko</span> </td><td> <span id="lblBrowser">Firefox 1.0</span> </td><td> <span id="lblPlatform">Win 98+ / OSX.2+</span> </td><td> <span id="lblEngine">A</span> </td><td> <tr> <td colspan="4"> </td> <td> <span id="lblCss">1.7</span> </td> </tr> </td> </tr><tr> <td> <span id="lblRender">Gecko</span> </td><td> <span id="lblBrowser">Firefox 1.5</span> </td><td> <span id="lblPlatform">Win 98+ / OSX.2+</span> </td><td> <span id="lblEngine">A</span> </td><td> <tr> <td colspan="4"> </td> <td> <span id="lblCss">1.8</span> </td> </tr> </td> </tr> </tbody><tfoot>   </tfoot> </table>