Repeater点击表头双向排序
2009-02-13 16:27
435 查看
repeater实现排序功能(双击升序排列,再双击降序排列).原理很简单,在<TD>中加个Ondblclick,用它来触发一个LinkButton的服务器事件.LinkButton的服务器事件里重新对数据源进行排序.然后再绑定Repeater.
要实现,首先需要在HTML里面加个javascript函数和两个Hidden,一个用来储存要排序的字段,还有一个用来储存升序还是降序.(asc/desc)
Javascript代码如下:
<script language="javascript">
function Getsort(obj)
{
document.all.sortfield.value=obj;
if (document.all.sortstring.value == 'ASC')
{
document.all.sortstring.value = 'DESC';
}
else if (document.all.sortstring.value == 'DESC')
{
document.all.sortstring.value = 'ASC';
}
__doPostBack('LinkButton1','');
}
</script>
HTML中:
<INPUT type="hidden" id="sortfield" runat="server">
<INPUT type="hidden" id="sortstring" runat="server" value="ASC">
<asp:LinkButton ID="LinkButton1" runat="server" visable="false">LinkButton</asp:LinkButton>
<td ondblclick="Getsort('Text');"><b>双击此处可排序</b></td>
后台代码如下:
private void Page_Load(object sender, System.EventArgs e)
{
if (!Page.IsPostBack)
{
CreaterDataSource("Text ASC");
}
}
private void CreaterDataSource(string sort)
{
OleDbConnection dbCon = new OleDbConnection ("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("Test.mdb"));
dbCon.Open();
OleDbDataAdapter adapter = new OleDbDataAdapter("SELECT * FROM Table", dbCon);
DataTable dt = new DataTable();
adapter.Fill(dt);
DataView dv = dt.DefaultView;
dv.Sort = sort;
Repeater1.DataSource=dv;
Repeater1.DataBind();
}
private void LinkButton1_Click(object sender, System.EventArgs e)
{
string sortString = Request.Form["sortstring"].ToString();
string sortfield = Request.Form["sortfield"].ToString();
string fullsortstring = sortfield+" "+sortString;
if (fullsortstring != ""&& fullsortstring!=null)
{
CreaterDataSource(fullsortstring);
}
}
上面主要列举了排序功能实现的代码.在HTML中的ondblclick中,您可以给Getsort方法不同的参数以获得对不同的字段进行排序,注意, Getsort方法的参数一定要设置为你想排序的字段名称.这样你就可以实现双击不同的列头进行当前列的排序功能.
整个实现的重点在设置 Repeater的sort属性,LinkButton1_Click事件中获取当前排序的字段和排序顺序的String,然后传给 CreaterDataSource方法.此方法根据传来的参数将DataView的Sort重新设置,然后绑定Repeater控件.OK!
要实现,首先需要在HTML里面加个javascript函数和两个Hidden,一个用来储存要排序的字段,还有一个用来储存升序还是降序.(asc/desc)
Javascript代码如下:
<script language="javascript">
function Getsort(obj)
{
document.all.sortfield.value=obj;
if (document.all.sortstring.value == 'ASC')
{
document.all.sortstring.value = 'DESC';
}
else if (document.all.sortstring.value == 'DESC')
{
document.all.sortstring.value = 'ASC';
}
__doPostBack('LinkButton1','');
}
</script>
HTML中:
<INPUT type="hidden" id="sortfield" runat="server">
<INPUT type="hidden" id="sortstring" runat="server" value="ASC">
<asp:LinkButton ID="LinkButton1" runat="server" visable="false">LinkButton</asp:LinkButton>
<td ondblclick="Getsort('Text');"><b>双击此处可排序</b></td>
后台代码如下:
private void Page_Load(object sender, System.EventArgs e)
{
if (!Page.IsPostBack)
{
CreaterDataSource("Text ASC");
}
}
private void CreaterDataSource(string sort)
{
OleDbConnection dbCon = new OleDbConnection ("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("Test.mdb"));
dbCon.Open();
OleDbDataAdapter adapter = new OleDbDataAdapter("SELECT * FROM Table", dbCon);
DataTable dt = new DataTable();
adapter.Fill(dt);
DataView dv = dt.DefaultView;
dv.Sort = sort;
Repeater1.DataSource=dv;
Repeater1.DataBind();
}
private void LinkButton1_Click(object sender, System.EventArgs e)
{
string sortString = Request.Form["sortstring"].ToString();
string sortfield = Request.Form["sortfield"].ToString();
string fullsortstring = sortfield+" "+sortString;
if (fullsortstring != ""&& fullsortstring!=null)
{
CreaterDataSource(fullsortstring);
}
}
上面主要列举了排序功能实现的代码.在HTML中的ondblclick中,您可以给Getsort方法不同的参数以获得对不同的字段进行排序,注意, Getsort方法的参数一定要设置为你想排序的字段名称.这样你就可以实现双击不同的列头进行当前列的排序功能.
整个实现的重点在设置 Repeater的sort属性,LinkButton1_Click事件中获取当前排序的字段和排序顺序的String,然后传给 CreaterDataSource方法.此方法根据传来的参数将DataView的Sort重新设置,然后绑定Repeater控件.OK!
相关文章推荐
- 实现Repeater控件点击表头排序功能
- Repeater 制作点击表头排序实例
- Repeater点击表头,排序功能
- 实现Repeater控件点击表头排序功能
- 实现Repeater控件点击表头排序功能
- 实现Repeater控件点击表头排序功能
- Repeater 制作点击表头排序实例
- Asp.net中,点击GridView表头实现数据的排序
- js/jquery常用方法(replaceALl、new Map()、点击th(表头)或拖动tr只前台排序)
- js对table排序(类似点击Excel表头排序)
- C# ListView中点击表头ColumnClick实现对相应列的排序
- JS实现点击表头表格自动排序(含数字、字符串、日期)
- 使用DevExpress.XtraGrid.Views.Grid.GridView 点击表头排序时焦点固定到所选中行的行号,而不是固定到这条数据
- 两个MSFlexGrid的函数 点击表头排序函数以及依据内容自动调整列宽为最合适的宽度
- Repeater 双向排序
- EasyUI Datagrid 分页的情况下实现点击表头的小三角图标对数据库中所有数据重新排序
- Vue 固定头 固定列 点击表头可排序的表格组件
- easyui datagrid 点击列表头排序出现错乱的原因
- 点击表头排序时,"分组"及"分组明细"的数据层次关系不变
- Repeater 实现复合表头、排序功能。