extjs 4.1远程网格排序和MVC过滤

Question

我需要添加排序和过滤到我的网格。网格是选项卡面板的一部分。我可以在萤火虫看到下面的参数来调用控制器：

_dc 1361741346485 
limit 200 
page 2 
sort [{"property":"IsLate","direction":"ASC"}] 
start 200 

我需要什么样的参数添加到控制器方法从请求排序参数接受？我想我需要序列化它。我试图创建一个具有属性和方向的排序对象，但是当我调试时，收到的参数具有属性和方向为空值。是否有一个我需要遵循的命名约定？我很困惑。 谢谢。

这是我的代码：
LateGrid.js

Ext.define('FICMTB.ui.LateModel', { 
     extend: 'Ext.data.Model', 
     fields: [ 
    { name: 'Id' },  
    { name: 'IsLate' },  
    { name: 'Comments' }, 
    { name: 'Description' }], 
    idProperty: 'Id' 
}); 

Ext.define("FICMTB.ui.LateGrid", { 
    extend: "Ext.grid.Panel", 
    requires: [ 
     'FICMTB.ui.LateModel', 
     'Ext.ux.grid.FiltersFeature' 
     ], 

initComponent: function() { 
    var me = this; 

    me.columns = me.buildColumns(); 
    me.filters = { 
     ftype: 'filters', 
     encode: false, // json encode the filter query 
     filters: [{ 
      options: ['YES', 'NO'], 
      dataIndex: 'IsLate' 
     }] 
    }; 
    me.features = [me.filters]; 
    me.store = Ext.create('Ext.data.Store', { 
     model: 'FICMTB.ui.LateModel', 
     remoteSort: true, 
     storeId: 'LateStoreId', 
     autoLoad: true, 
     buffered: true, 
     autoSync: true, 

     pageSize: 200, 
     proxy: { 
      type: 'rest', 
      timeout: 600000, 

      url: '/Late/Transactions/', 
      reader: { 
       type: 'json', 
       root: 'transactions', 
       totalProperty: "Total" 
      }, 
      writer: { 
       type: 'json', 
       root: 'transactions' 
      } 
     } 
    }); 

    me.selModel = new Ext.selection.RowModel({ 
     singleSelect: true 
    }); 

    me.autoSizeColumns = true; 

    me.autoScroll = true; 
    me.forcefit = true; 

    me.callParent(arguments); 
}, 

buildColumns: function() { 
    var me = this; 

    return [ 
    { text: 'Id', dataIndex: 'Id', hidden: true, hideable: false }, 
    { text: 'Is Late' dataIndex: 'IsLate', sortable: true, width: 50, filter:true},  
    { text: 'Comments', dataIndex: 'Comments', width: 250, sortable: true }, 
    { text: 'Description', dataIndex: 'Description', width: 250, sortable: true }]; 
    }, 
    height: 600, 
    width: 'auto' 
}); 

LateController.cs

[AcceptVerbs(HttpVerbs.Get)] 
[ActionName("LateTransactions")] 
public ActionResult GetLateTransactions(string page, string start, string limit, xxxxxx sorting, yyyyy filtering) 
{ 
    // what should xxxxx and yyyyy be? how should I name the sorting and filtering parameters? 
    //   returns json 
} 

编辑： 我尝试使用排序的对象，但它作为空

// Sorting 
// NOT Simple Sort: 
// Request: index?sort=[{"property":"email","direction":"DESC"}, {"property":"last_name","direction":"ASC"}, ...] 
public class Sorting 
{ 
    public string property { set; get; } 
    public string direction { set; get; } 
} 

[AcceptVerbs(HttpVerbs.Get)] 
[ActionName("LateTransactions")] 
public ActionResult GetLateTransactions(string page, string start, string limit, Sorting sort, yyyyy filtering) 
{ 
    .... 
} 

Answer 1

对于排序我实际上是得到一个JSON字符串。我不得不编码设置为true，过滤器，以便传递给我的控制器方法的过滤器参数是一个JSON字符串：

me.filters = { 
     ftype: 'filters', 
     **encode: true, // json encode the filter query** 
     filters: [{ 
      options: ['YES', 'NO'], 
      dataIndex: 'IsLate' 
     }] 
    }; 

我使用的是具有DeserializeObject方法Newtonsoft库 - 它需要一个JSON字符串，并将其转换成一个东西。所以，过滤，我的目标是：

public class Filtering 
    { 
     public string type { get; set; } 
     public string value { get; set; } 
     public string field { get; set; } 
    } 

，并在我的控制器：

[AcceptVerbs(HttpVerbs.Get)] 
    [ActionName("LateTransactions")] 
    public ActionResult GetLateTransactions(string page, string start, string limit, Sorting sort, Filtering filter) 
    { 
    // get all the filters 
     List<Filtering> deserzdFilter = JsonConvert.DeserializeObject<List<Filtering>>(filter); 
     .... 
//   returns json(model); 
    } 

Answer 2

我不是很熟悉MVC3可言，但你需要做的是：

• 地图参数正确的（你可能会通过使用该方法的字符串排序参数做到这一点），并确保你获取排序值作为JSON字符串。
• 然后你需要反序列化JSON字符串作为一个对象（我认为这将有助于：http://msdn.microsoft.com/en-us/library/bb412179.aspx）。

Answer 3

我也不知道MVC3，但是我已经使用.Net WCF与Extjs取得了很好的成功。例如...

[OperationBehavior(Impersonation = ImpersonationOption.Allowed)] 
    [WebInvoke(Method = "GET")] 
    public Stream getEvent_list(string TableName, string WhereParams,string page, string start, string limit, string sort) 
    { 
     string sorting = "date desc"; 

     if (WhereParams == null) WhereParams = ""; 
     if (sort != null) 
     { 
      sorting = getSorting(sort); // parse the sorting json parameter 
     } 

blah blah.... 

     string sql = "select * from mytable order by " + sorting; 
     /// return json as streamn 

    } 

// -------------------- getSorting ------------------------------------------------ 
// Parse the passed sorting JSON object into a string for SQL query. 
// for example sort= [{property:'dr'},{order:'desc'},{property:'doi'},{order:'asc'},] 
// gets converted to 'dr desc, dor asc' (SQL friendly format). 

    private string getSorting(string sort) 
    { 
     string sorting = ""; 

     string[] pairs = sort.Split(','); 

     for (int i=0; i< pairs.Length; i +=2) 
     { 
      string[] pair = pairs[i].Split(':'); 
      string[] ord = pairs[i+1].Split(':'); 

      if (sorting.Length > 0) 
      { 
       sorting += ","; 
      } 
      // get rid of all extra json characters. 
      sorting += pair[1].Trim(' ', '{', '}', '[', ']', '\\', '\"', '"') + " " + ord[1].Trim(' ', '{', '}', '[', ']', '\\', '\"', '"'); 
     } 

     return sorting; 
    }