/// <summary>
/// grid参数设置
/// </summary>
/// <returns></returns>
public static GridConfig GetGridConfig()
{
var gc = new GridConfig();
gc.filterMode = FilterModel.advanced;//高级筛选模式
gc.showToolbar = false;
gc.pageSize = 20;
gc.width = "90%";
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id", width="40px", cellsalign=AlignType.left,datatype=Datatype.dataint, pinned=true },
new GridColumn(){ text="名称", datafield="name",width="200px", cellsalign=AlignType.left,datatype=Datatype.datastring, pinned=true },
new GridColumn(){ text="产品名", datafield="productname",width="1000px", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="数量", datafield="quantity", width="800px", cellsalign=AlignType.right , datatype=Datatype.dataint },
new GridColumn(){ text="创建时间", datafield="date",width="200px", cellsformat="yyyy-MM-dd",cellsalign=AlignType.right, datatype=Datatype.datadate
}
};
return gc;
}
/// <summary>
/// grid参数设置
/// </summary>
/// <returns></returns>
public static GridConfig GetGridConfig()
{
var gc = new GridConfig();
gc.filterMode = FilterModel.advanced;//高级筛选模式
gc.pageSize = 20;
gc.width = "90%";
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id", width="40px", cellsalign=AlignType.left,datatype=Datatype.dataint },
new GridColumn(){ text="名称", datafield="name", cellsalign=AlignType.left,datatype=Datatype.datastring,cellsRenderer="new $page().grid.myCellsRenderer" },
new GridColumn(){ text="产品名", datafield="productname", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="数量", datafield="quantity", cellsalign=AlignType.right , datatype=Datatype.dataint },
new GridColumn(){ text="创建时间", datafield="date", cellsformat="yyyy-MM-dd",cellsalign=AlignType.right, datatype=Datatype.datadate
}
};
return gc;
}
/// <summary>
/// grid参数设置
/// </summary>
/// <returns></returns>
public static GridConfig GetGridConfig()
{
var gc = new GridConfig();
gc.filterMode = FilterModel.advanced;//高级筛选模式
gc.gridbuttons = new List<GridButton>()
{
new GridButton(){ click="new $page().gridMethod.add", name="addbutton", icon="jqx-icon-plus", title="添加"},
new GridButton(){ click="new $page().gridMethod.edit", name="editbutton", icon="jqx-icon-edit", title="编辑"},
new GridButton(){ click="new $page().gridMethod.del", name="delbutton", icon="jqx-icon-delete", title="删除"}
};
gc.pageSize = 20;
gc.width = "90%";
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id", width="40px", cellsalign=AlignType.left,datatype=Datatype.dataint },
new GridColumn(){ text="名称", datafield="name", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="产品名", datafield="productname", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="数量", datafield="quantity", cellsalign=AlignType.right , datatype=Datatype.dataint },
new GridColumn(){ text="创建时间", datafield="date", cellsformat="yyyy-MM-dd",cellsalign=AlignType.right, datatype=Datatype.datadate
}
};
return gc;
}
/// <summary>
/// grid参数设置
/// </summary>
/// <returns></returns>
public static GridConfig GetGridConfig()
{
var gc = new GridConfig();
gc.filterMode = FilterModel.advanced;//高级筛选模式
gc.showToolbar = false;
gc.pageSize = 20;
gc.editable = true;
gc.width = "50%";
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id", width="80px", cellsalign=AlignType.left,datatype=Datatype.dataint
},
new GridColumn(){ text="名称", datafield="name",columntype= ColumnType.template, cellsalign=AlignType.left,datatype=Datatype.datastring,
initEditor="new $page().grid.initCustomEditor",
getEditorValue="new $page().grid.getCustomEditorValue" ,
createEditor="new $page().grid.createCustomEditor"},
new GridColumn(){ text="产品名", datafield="productname",columntype= ColumnType.template, cellsalign=AlignType.left,datatype=Datatype.datastring,// BUG 使用createEditor , cellsformat一定要等于空 并且不能锁表头
initEditor="new $page().grid.initInputEditor",
getEditorValue="new $page().grid.getInputEditorValue" ,
createEditor="new $page().grid.createInputEditor"}
};
return gc;
}
/// <summary>
/// grid参数设置
/// </summary>
/// <returns></returns>
public static GridConfig GetGridConfig()
{
var gc = new GridConfig();
gc.filterMode = FilterModel.advanced;//高级筛选模式
gc.pageSize = 20;
gc.width = "90%";
gc.showToolbar = false;
gc.filterable = false;
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id", width="40px", cellsalign=AlignType.left,datatype=Datatype.dataint },
new GridColumn(){ text="名称", datafield="name", cellsalign=AlignType.left,datatype=Datatype.datastring,columngroup="group1" },
new GridColumn(){ text="产品名", datafield="productname", cellsalign=AlignType.left,datatype=Datatype.datastring ,columngroup="group1"},
new GridColumn(){ text="数量", datafield="quantity", cellsalign=AlignType.right , datatype=Datatype.dataint,columngroup="group2" },
new GridColumn(){ text="创建时间", datafield="date", cellsformat="yyyy-MM-dd",cellsalign=AlignType.right, datatype=Datatype.datadate ,columngroup="group2"
}
};
gc.columnGroups = new List<ColumnGroups>()
{
new ColumnGroups(){ name="group1", text="标题1", align=AlignType.center},
new ColumnGroups(){ name="group2", text="标题2", align=AlignType.center}
};
return gc;
}
public ActionResult Index()
{
var adp = new GridDataAdapterSource();
adp.url = "/Grid/Data";
adp.extendData = "a";
var gc = new GridConfig();
gc.gridbuttons = new List<GridButton>()
{
new GridButton(){ click="add", name="addbutton", icon="jqx-icon-plus", title="添加"},
new GridButton(){ click="edit", name="editbutton", icon="jqx-icon-edit", title="编辑"},
new GridButton(){ click="del", name="delbutton", icon="jqx-icon-delete", title="删除"}
};
gc.initRowDetails = "initRowDetails";
gc.pageSize = 20;
gc.width = "80%";
gc.filterMode = FilterModel.advanced;
gc.selectionMode = SelectionMode.multipleRows;
// gc.rowDetails = true;
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id",hidden=true, width="40px", cellsalign=AlignType.left,datatype=Datatype.dataint },
new GridColumn(){ text="名称", datafield="name", className="minwidth", width="200", cellsalign=AlignType.left,datatype=Datatype.datastring, cellsRenderer="namefun" },
new GridColumn(){ text="产品名", datafield="productname", width="500px", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="数量", datafield="quantity", cellsalign=AlignType.right , datatype=Datatype.dataint },
new GridColumn(){ text="创建时间", datafield="date", cellsformat="yyyy-MM-dd",cellsalign=AlignType.right, datatype=Datatype.datadate
}
};
JQXGrid.PublicMehtod.ColumnsPrependCheckbox(gc.columns);
var grid = JQXGrid.BindGrid("#netgrid", adp, gc);
ViewBag.validationBind = ValidationSugar.GetBindScript("validate_key_grid_index");
return View(grid);
}
public ActionResult Index()
{
var adp = new GridDataAdapterSource();
adp.url = "/Grid/Data";
var gc = new GridConfig();
gc.gridbuttons = new List<GridButton>()
{
new GridButton(){ click="add", name="addbutton", icon="jqx-icon-plus", title="添加"},
new GridButton(){ click="edit", name="editbutton", icon="jqx-icon-edit", title="编辑"},
new GridButton(){ click="del", name="delbutton", icon="jqx-icon-delete", title="删除"}
};
gc.pageSize = 20;
gc.width = "80%";
gc.columns = new List<GridColumn>(){
new GridColumn(){ text="编号", datafield="id", width="40px", cellsalign=AlignType.left,datatype=Datatype.dataint },
new GridColumn(){ text="名称", datafield="name", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="产品名", datafield="productname", cellsalign=AlignType.left,datatype=Datatype.datastring },
new GridColumn(){ text="数量", datafield="quantity", cellsalign=AlignType.right , datatype=Datatype.dataint },
new GridColumn(){ text="创建时间", datafield="date", cellsformat="yyyy-MM-dd",cellsalign=AlignType.right, datatype=Datatype.datadate
}
};
var grid = JQXGrid.BindGrid("#netgrid", adp, gc);
ViewBag.validationBind = ValidationSugar.GetBindScript("validate_key_grid_index");
return View(grid);
}
public static object BindGrid(string gridSelector, GridDataAdapterSource gda, GridConfig gc)
{
var rootUrl = GetRootURI();
if (rootUrl != "/")
{
gda.url = rootUrl + "/" + gda.url.TrimStart('/');
}
if (gda.datafields == null || gda.datafields.Count == 0)
{
foreach (var it in gc.columns)
{
gda.datafields.Add(new GridDatafield()
{
type = it.datatype, name = it.datafield
});
}
}
StringBuilder gridHtml = new StringBuilder();
gridHtml.AppendFormat(@"var source =
{0}", jss.Serialize(gda));
gridHtml.AppendLine();
gridHtml.Append(@" var dataAdapter = new $.jqx.dataAdapter(source, {
downloadComplete: function (data) {
source.totalrecords = data.TotalRows;
},
formatData:" + (!string.IsNullOrEmpty(gda.extendData) ? "function (data) { " + gda.extendData + "(data); return data; }" : "function (data) { return data; }") + @"
});");
gridHtml.AppendLine();
gridHtml.AppendFormat(@"$(""{0}"").jqxDataTable(", gridSelector);
if (string.IsNullOrEmpty(gc.renderToolbar))
{
gc.renderToolbar = "${toolbar}";
}
gridHtml.Append(jss.Serialize(gc));
gridHtml.Append(");");
var reval = gridHtml.ToString();
if (gc.editable)
{
reval = reval.Replace("${updateRow}", @" function (rowId, rowData, commit) {commit(true); }");
}
else
{
reval = reval.Replace("${updateRow}", @" function (rowId, rowData, commit) { }");
}
reval = reval
.Replace("\"${toolbar}\"", GetToolbar(gridSelector, gc))
.Replace("\"source\":\"dataAdapter\"", "\"source\":dataAdapter")
.Replace("\"${localization}\"", "jqxLocalization");
reval += GetCheckFunc(gridSelector);
string checkBoxEeventHtml = @"
$(""" + gridSelector + @""").on(""click"", ""input:checkbox"", function () {
var th = $(this);
var isChecked = th.prop(""checked"");
if (!isChecked) {
$(""" + gridSelector + @""").find(""#jqx_datatable_checkbox_all"").jqxCheckBox(""uncheck"");
}
});
setTimeout(function () {
$(window).resize();
},2000)
";
reval = string.Format(@"$(function(){{ {0};
{1} }})", reval, checkBoxEeventHtml);
reval = ("<script>\r\n") + reval
+ @"
$(function () {
var data = $(""body"").on(""click"", """ + gridSelector + @" .jqx_datatable_checkbox"", function () {
if ($(""body"").data(""checkboxloading"") == null) {
var th = $(this);
var index = th.attr(""data-cbindex"");
console.log(index)
var num = 0;
var setInt = setInterval(function () {
$(""" + gridSelector + @" .jqx_datatable_checkbox"").eq(index).prop(""checked"", true);
num = num + 100;
if (num / 100 == 15) {
clearInterval(setInt);
}
}, 100);
}
});
setTimeout(function () {
$(""body"").data(""checkboxloading"", true);
}, 2000);
})"
+ ("\n\r</script>");
reval = FuncAction(reval, @"""cellsRenderer""\:""(.*?)""");
reval = FuncAction(reval, @"""renderer""\:""(.*?)""");
reval = FuncAction(reval, @"""rendered""\:""(.*?)""");
reval = FuncAction(reval, @"""initRowDetails""\:""(.*?)""");
reval = FuncAction(reval, @"""createEditor""\:""(.*?)""");
reval = FuncAction(reval, @"""initEditor""\:""(.*?)""");
reval = FuncAction(reval, @"""getEditorValue""\:""(.*?)""");
reval = FuncAction(reval, @"""ready""\:""(.*?)""");
reval = FuncAction(reval, @"""updateRow""\:""(.*?)""");
return(reval);
}
private static string GetToolbar(string gridSelector, GridConfig gc)
{
StringBuilder sb = new StringBuilder(@"
function (toolBar) {
var theme = ""Arctic"";
var toTheme = function (className) {
if (theme == """") return className;
return className + "" "" + className + ""-"" + theme;
}
// appends buttons to the status bar.
var container = $(""<div style='overflow: hidden; position: relative; height: 100%; width: 100%;'></div>"");
var buttonTemplate = ""<div style='float: left; padding: 3px; margin: 2px;'><div style='margin: 4px; width: 16px; height: 16px;'></div></div>"";");
sb.AppendLine();
gc.gridbuttons.ForEach(it =>
{
sb.AppendFormat("var {0} = $(buttonTemplate); {0}.attr('data-id','{0}');", it.name);
sb.AppendLine();
});
gc.gridbuttons.ForEach(it =>
{
sb.AppendFormat(" container.append({0});", it.name);
sb.AppendLine();
});
sb.AppendLine();
sb.Append("toolBar.append(container)");
sb.AppendLine();
gc.gridbuttons.ForEach(it =>
{
sb.AppendFormat(@"
{0}.jqxButton({{ cursor: ""pointer"", enableDefault: false, height: 25, width: 25 }});
{0}.find('div:first').addClass(toTheme('{2}'));
{0}.jqxTooltip({{ position: 'bottom', content: ""{1}"" }});", it.name, it.title, it.icon);
sb.AppendLine();
});
sb.AppendLine();
sb.Append(@"
var row = null;
$(""" + gridSelector + @""").on('rowSelect', function (event) {
row= event.args.row;
});");
sb.AppendLine();
sb.Append(@"
$(""" + gridSelector + @""").on('rowUnselect', function (event) {
row = null;
});");
sb.AppendLine();
gc.gridbuttons.ForEach(it =>
{
if (!string.IsNullOrWhiteSpace(it.click))
{
sb.AppendLine();
string clickHtml = it.click;
sb.AppendFormat(@" {1}.click(function (event) {{
{0}(row);
}});", clickHtml, it.name);
}
});
sb.AppendLine();
sb.Append("}");
return(sb.ToString());
}