【新特性速遞】取消表格排序與排序提示資訊(SortingCancel,SortingToolTip)

三生石上(FineUI控制元件)發表於2020-09-08

FineUIPro/Mvc/Core的下個版本(v7.0.0),我們會支援取消表格排序(SortingCancel),以及為表格標題欄增加排序的提示資訊(SortingToolTip)。

 

目前的版本,一旦設定了表格的排序列,就不能取消了,只能改變列的排序狀態或者切換當前排序列。

新版本會增加取消排序的功能,透過為表格增加SortingCancel=true屬性即可,有兩種方式取消排序:

  • 點選標題欄,會依次觸發:升序 -> 降序 -> 取消排序
  • 點選標題欄旁邊的下拉選單,可見【取消排序】選單項

【新特性速遞】取消表格排序與排序提示資訊(SortingCancel,SortingToolTip)

 

對後臺程式碼的影響,就是我們需要根據SortField是否為空,確定當前是否沒有列處於排序狀態。

下面透過官網示例,來對比下增加取消排序後對後臺程式碼的影響:https://pro.fineui.com/#/grid/grid_sorting.aspx

之前版本的邏輯:

private void BindGrid()
{
	string sortField = Grid1.SortField;
	string sortDirection = Grid1.SortDirection;

	DataTable table = DataSourceUtil.GetDataTable();

	DataView view1 = table.DefaultView;
	view1.Sort = String.Format("{0} {1}", sortField, sortDirection);

	Grid1.DataSource = view1;
	Grid1.DataBind();
}

 

新版本的邏輯:

private void BindGrid()
{
	string sortField = Grid1.SortField;
	string sortDirection = Grid1.SortDirection;

	DataTable table = DataSourceUtil.GetDataTable();

	// 判斷是否啟用排序
	if (!String.IsNullOrEmpty(sortField))
	{
		DataView view1 = table.DefaultView;
		view1.Sort = String.Format("{0} {1}", sortField, sortDirection);
		Grid1.DataSource = view1;
	}
	else
	{
		Grid1.DataSource = table;
	}
	
	Grid1.DataBind();
}

增加取消排序後,如果Grid1.SortField為空,則說明沒有列處於排序狀態,因為繫結的資料就無需排序處理。

 

下面來看下另一個更新:排序的提示資訊

這個更新對有些使用者非常必要,因為他們總是搞不清楚箭頭向上和向下的含義,除非透過排序後的資料,否則對升級和降序沒有啥子概念。

 

下面來看下錶格啟用SortingToolTip=true後的效果:  

【新特性速遞】取消表格排序與排序提示資訊(SortingCancel,SortingToolTip)

如果列處於未排序狀態,游標移動到列標題欄時,會提示【點選按升序排序】。

注意:提示資訊表明點選操作後的狀態,而非當前的排序狀態(這個頁面業界通用的做法)。

 

如果當前處於升序狀態,提示文字是【點選按降序排序】:

【新特性速遞】取消表格排序與排序提示資訊(SortingCancel,SortingToolTip)

 

這個提示資訊已經做了多語言處理,來看下英文中的樣子:

【新特性速遞】取消表格排序與排序提示資訊(SortingCancel,SortingToolTip)

 

 

歡迎入夥:https://fineui.com/fans/

三石出品,必屬精品 

相關文章