EXTJS4 Grid Filter 外掛的使用 與後臺資料解析------Extjs 查詢篩選功能的實現
阿新 • • 發佈:2022-05-02
先汗一個,一個小功能又踢騰了一天。本來這個帶Demo的,但是上面介紹的不是很詳細。用的時候問題不大,主要問題在檔案匯入方面.以為這個外掛的使用和其他的不一樣。
1.首先是需要引入檔案的位置:如圖
需要把整個grid都考到vs下,vs中結構如下:
2.設定路徑,將檔案匯入
Ext.Loader.setConfig({ enabled: true }); Ext.Loader.setPath('Ext.ux', '../ext-js4.2/ux'); Ext.require([ '*', 'Ext.toolbar.Paging', 'Ext.ux.grid.FiltersFeature',//必不可少的 'Scripts.*' ])
3.組織外掛配置,這裡你也可以將它組織成類
var filters = {
alias: 'widget.filters',
ftype: 'filters',
encode: false, // json encode the filter query
//指定要對哪些列進行過濾
filters: [{
type: 'boolean',
dataIndex: 'IsSuccessed'
}]
};
這裡的filter的type有string,boolean,numeric,date,還有list。前四個很容易理解,第五個類似enum,就是列可供選擇的常量值。
4.將外掛放入gridpanel
features: [filters],
5.怎麼在後臺獲取傳入的值呢?
先看下篩選的時候都往後臺傳了什麼:
這還只是 一條篩選,如果再幾個條件更麻煩,解決方法如下:
//外層資料 public class ExtFilterInfo { public string Field { get; set; } public ExtFilterData Data { get; set; } } //內層資料 public class ExtFilterData { public string Type { get; set; } public string Value { get; set; } public string Comparison { get; set; } }
模型資料繫結解析
public class ExtFilterInfoModelBinder : DefaultModelBinder
{
public override object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
{
var filter = (ExtFilterInfo)base.BindModel(controllerContext, bindingContext);
var field = bindingContext.ValueProvider.GetValue(bindingContext.ModelName + "[field]");
if (field != null)
{
filter.Field = field.AttemptedValue;
}
var type = bindingContext.ValueProvider.GetValue(bindingContext.ModelName + "[data][type]");
var value = bindingContext.ValueProvider.GetValue(bindingContext.ModelName + "[data][value]");
var comparison = bindingContext.ValueProvider.GetValue(bindingContext.ModelName + "[data][comparison]");
if (filter.Data == null)
{
filter.Data = new ExtFilterData();
}
if (type != null)
{
filter.Data.Type = type.AttemptedValue;
}
if (value != null)
{
filter.Data.Value = value.AttemptedValue;
}
if (comparison != null)
{
filter.Data.Comparison = comparison.AttemptedValue;
}
return filter;
}
}
然後註冊registered in Application_Start方法中(將下面程式碼放進去)
ModelBinders.Binders.Add(typeof(Oland.HIP.WebAdmin.API.ExtFilterInfo), new Oland.HIP.WebAdmin.API.ExtFilterInfoModelBinder());
9.後臺資料改怎麼接受
public PageData<Monitor[]> Get([FromUri]string _dc, [FromUri] int page, [FromUri] int start, [FromUri] int limit, [FromUri] ExtFilterInfo[] filter)
{
}
OK,結束, 本來想給大家看看貼點資料呢,電腦卡的要死,就算了……,如果感覺對您有所幫助的話請點推薦,謝謝……