MVC3-RAZOR WebGrid 用法詳解

WebGrid的方法簽名

public WebGrid(

IEnumerable<dynamic> source, 設置數據源

IEnumerable<string> columnNames = null, 要顯示的列名

string defaultSort = null, 默認排序的字段

int rowsPerPage = 10, 每頁的行數

bool canPage = true, 是否允許分頁

bool canSort = true, 是否允許排序

string ajaxUpdateContainerId = null,

string ajaxUpdateCallback = null,

string fieldNamePrefix = null,字段名的前綴

string pageFieldName = null,

string selectionFieldName = null,

string sortFieldName = null,

string sortDirectionFieldName = null);

代碼

List<CMS5_Razor.Models.Test> list = new List<CMS5_Razor.Models.Test>(); 
    for (int i = 0; i < 210; i++) { 
        list.Add(new CMS5_Razor.Models.Test() { Name = "name" + i, Order = i, Content = "content" + i }); 
    }
    var grid = new WebGrid(source: list, rowsPerPage: 5, canPage: true 
        , selectionFieldName: "Name" 
        , fieldNamePrefix: "字段名的前綴" 
        );

WebGrid.GetHtml函數簽名

 

public IHtmlString GetHtml(

string tableStyle = null,表格樣式

string headerStyle = null,頭部

string footerStyle = null, 底部

string rowStyle = null, 每一行的樣式

string alternatingRowStyle = null, 交替行

string selectedRowStyle = null, 被選中

string caption = null,標題

bool displayHeader = true, 是否顯示頭部

bool fillEmptyRows = false, 是否填充空行

string emptyRowCellValue = null, 空行裏每個字段顯示的值

IEnumerable<WebGridColumn> columns = null, 在這裏設置各列

IEnumerable<string> exclusions = null, 不顯示的字段

WebGridPagerModes mode =枚舉值，一般情況選擇WebGridPagerModes.All

string firstText = null, 對應第一頁鏈接顯示的文字

string previousText = null, 對應上一頁鏈接顯示的文字

string nextText = null, 對應下一頁鏈接顯示的文字

string lastText = null, 對應最後一頁鏈接顯示的文字

int numericLinksCount = 5,數字選擇項的數目

object htmlAttributes = null  ~beta版本源碼中沒查到，暫時不知道如何使用，

);

Column的方法簽名

public WebGridColumn Column(string columnName = null,

string header = null,列頭的名字

Func<dynamic, object> format = null,  自定義的輸出,非常實用

string style = null, 樣式

bool canSort = true);是否允許排序 

 

@grid.GetHtml( 
columns: grid.Columns( 
      grid.Column("Name", "名字", style: "mynameStyle"), 
                 grid.Column("Content", "Content", style: "mynameStyle"), 
      grid.Column("Order", "順序", format: @<b><i>@item.Order</i></b>, canSort: false) 
                       ), tableStyle: "grid", headerStyle: "headerStyle1", selectedRowStyle: "selectedRowStyle", 
                  caption: "我是標題", displayHeader: !IsPost, 
                  fillEmptyRows: !IsPost, emptyRowCellValue: "這行沒東西", 
                  mode: WebGridPagerModes.All, firstText: "第一頁", 
                  previousText: "上一頁", nextText: "下一頁", lastText: "最後一頁", 
                numericLinksCount: 15
)