c# - It is possible to use DataTables Column Filter Add-on with a Gridview -
i trying use datatables column filter add-on on gridview table using sql datasource not coming luck. have gridview render header , footer can not add footer.
<%@ page language="c#" autoeventwireup="true" codefile="glossary.aspx.cs" inherits="home.glossary" %> <!doctype html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title spellcheck="true">glossary</title> <style type="text/css" media="all"> @import "datatables-1.9.4/datatables-1.9.4/media/css/jquery.datatables_themeroller.css"; #form1 { width: 100%; } </style> <script src="datatables-1.9.4/datatables-1.9.4/media/js/jquery.js"></script> <script src="datatables-1.9.4/datatables-1.9.4/media/js/jquery.datatables.js"></script> <script src="jquery-datatables-columnfilter/media/js/jquery.datatables.columnfilter.js"></script> <script> $(document).ready(function () { $('#<%=gridview1.clientid%>').datatable().columnfilter(); }); </script> </head> <body> <form id="form1" runat="server"> <div style="background: #a0a0a0"> </div> <asp:gridview id="gridview1" runat="server" datakeynames="termtext,defnbr,defvernbr" datasourceid="tedglossary" enablesortingandpagingcallbacks="true" onselectedindexchanged="gridview1_selectedindexchanged" showfooter="true" autogeneratecolumns="false" autogenerateeditbutton="false" style="margin-right: 0px" width="100%" height="382px"> <columns> <asp:boundfield datafield="termtext" headertext="term" readonly="true" sortexpression="term" /> <asp:boundfield datafield="defnbr" headertext="number" readonly="true" sortexpression="definitionnumber" /> <asp:boundfield datafield="defvernbr" headertext="version" readonly="true" sortexpression="definitinonversionnumber" /> <asp:boundfield datafield="deftext" headertext="definition" sortexpression="definition" /> <asp:boundfield datafield="amplifyingexplanationtext" headertext="amplifying explanation" sortexpression="amplifyingexplanationtext" /> <asp:boundfield datafield="seealsotext" headertext="see also" sortexpression="see also" /> <asp:boundfield datafield="authoritativesrctext" headertext="authoritative source" sortexpression="authoritativesrctext" /> <asp:boundfield datafield="scopename" headertext="scope" sortexpression="scope" /> <asp:boundfield datafield="domnname" headertext="domain" sortexpression="domain" /> <asp:boundfield datafield="governancestatename" headertext="governance state" sortexpression="governancestatename" /> <asp:boundfield datafield="lastupdttimestamp" headertext="last updated" sortexpression="lastupdttimestamp" /> </columns> </asp:gridview> <asp:sqldatasource id="tedglossary" runat="server" connectionstring="<%$ connectionstrings:glsry_taylor %>" selectcommand="select * [glossary] order [termtext]"></asp:sqldatasource> </form> </body> </html> here cs rendering
using system; using system.collections.generic; using system.linq; using system.web; using system.web.ui; using system.web.ui.webcontrols; namespace home { public partial class glossary : system.web.ui.page { protected void page_load(object sender, eventargs e) { gridview1.prerender += new eventhandler(gridview1_prerender); } protected void gridview1_prerender(object sender, eventargs e) { if (gridview1.rows.count > 0) { //forces grid render thead/tbody/tfoot elements gridview1.useaccessibleheader = true; gridview1.headerrow.tablesection = tablerowsection.tableheader; gridview1.footerrow.tablesection = tablerowsection.tablefooter; } } protected void gridview1_selectedindexchanged(object sender, eventargs e) { } } } here html output, there site handle put in pastebin link included
in order add footer, need use templatefield controls rather boundfield controls. see http://www.dreamincode.net/forums/topic/222381-insert-data-using-gridview-footerrow/ example of how this. 1 thing note though, html generated gridview control use <td> elements in footer rather <th> elements expected datatables documentation.
Comments
Post a Comment