我有一个像上传截图的设计,我需要填充数据库中的数据,并且不想放弃过滤分页和JQuery数据表提供的搜索选项。任何人都可以共享一些有用的代码或代码链接来实现这一目标吗?我尝试使用gridview和Listview但没有取得多大成功。
答案 0 :(得分:1)
使用asp网格视图....使用分页属性 过滤你必须找到一些方法 如何做分页: 转到gridview属性
答案 1 :(得分:0)
<script type="text/javascript" language="javascript" src="Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript" language="javascript" src="Scripts/jquery.datatables.min.js"></script>
<link type="text/css" href="Content/jquery.dataTables.min.css" rel="stylesheet" />
................
<div class="row">
<div class="col-md-4">
<asp:GridView ID="GridView1" runat="server" CssClass="gvdatatable" AutoGenerateColumns="true" OnPreRender="GridView1_PreRender">
</asp:GridView>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
$('.gvdatatable').dataTable({});
});
</script>
C#代码..
protected void GridView1_PreRender(object sender, EventArgs e)
{
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "SELECT [OrderNo],[Name],[Email],[Date],[Amount],[Status] FROM dbo.tbl_Orders";
cmd.Connection = con;
using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
{
DataTable dt = new DataTable();
sda.Fill(dt);
GridView1.DataSource = dt;
GridView1.DataBind();
if (GridView1.Rows.Count > 0)
{
//Replace the <td> with <th> and adds the scope attribute
GridView1.UseAccessibleHeader = true;
//Adds the <thead> and <tbody> elements required for DataTables to work
GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
//Adds the <tfoot> element required for DataTables to work
GridView1.FooterRow.TableSection = TableRowSection.TableFooter;
//GridView1.DataSource = GetData(); //GetData is your method that you will use to obtain the data you're populating the GridView with
}
}
}
}
}