jqgrid的导入和导出:jqGridImport & jqGridExport
来源:互联网 发布:算法那本书好 编辑:程序博客网 时间:2024/06/10 01:50
今天看到一个很好的ASP.NET MVC Razor使用jqGrid的示例,本文正是学习此示例中的一个功能。有关jqGridImport的文档,请参考这里
jqGrid还有一个很有用的功能,可以导入和导出jqGrid的配置,这就意味着:使用c#的匿名类加上JsonResult(ASP.NET MVC)用C#的代码生成jqGrid,而不再使用js代码,很多人都怕写js,宁愿写两行C#都不愿意写一行js,这个功能对于不愿意写js的兄弟来说真是一个福音啊,天也不早了,直接上内容吧。
Razor下View是这样写的
@{
Layout = null;
}
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>jqGridImport</
title
>
<
link
href
=
"@Url.Content("
~/Content/themes/base/site.css")"
rel
=
"Stylesheet"
type
=
"text/css"
/>
<
link
href
=
"@Url.Content("
~/Content/themes/base/jquery.ui.css")"
rel
=
"Stylesheet"
type
=
"text/css"
/>
<
link
href
=
"@Url.Content("
~/Content/themes/base/jquery.jqgrid.css")"
rel
=
"Stylesheet"
type
=
"text/css"
/>
<
script
src
=
"@Url.Content("
~/Scripts/jquery.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/jquery.ui.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/i18n/grid.locale-cn.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/jquery.jqgrid.js")"
type
=
"text/javascript"
></
script
>
<
script
type
=
"text/javascript"
>
$(function () {
$('#grid').jqGridImport({
imptype: 'json',
impurl: '@Url.Action("Import", "Home")',
mtype: 'GET',
jsonGrid: {
config: 'configs'
}
});
});
</
script
>
</
head
>
<
body
style
=
"padding: 10px;"
>
<
div
>
<
table
id
=
"grid"
>
</
table
>
<
div
id
=
"pager"
>
</
div
>
</
div
>
</
body
>
</
html
>
这里我对代码中用到的几个选项做个说明,没有用到的请参考这里的文档
imptype:jqGrid导入"模板"(请允许我给它起了这么一个不伦不类的名称,下同)是json格式的,当然,还可以是xml格式的,但是我想一般也没有人用xml,就没有深究。
impurl:jqGrid导入"模板"是从该url获取的。
mtype:这个简单,是获取导入"模板"的http方法。
jsonGrid:从哪里获取json格式的导入"模板"配置选项,这里稍作解释,从impurl中获取的是一个对象,jsonGrid中的config指的是获取到的这个对象的哪个属性是配置选项,过会看了后台代码就比较好理解了。
OK,现在来看后台代码是啥样的吧:
public
ActionResult Import()
{
var configs =
new
{
url =
"/User/Index"
,
datatype =
"json"
,
mtype =
"GET"
,
colNames =
new
[] {
"主键"
,
"姓名"
,
"邮箱"
},
colModel =
new
[] {
new
{ name =
"ID"
, index =
"ID"
, width = 200, hidden=
true
, align =
"left"
},
new
{ name =
"Name"
, index =
"Name"
, width = 200,hidden=
false
, align =
"left"
},
new
{ name =
"Mail"
, index =
"Mail"
, width = 200,hidden=
false
, align =
"left"
}
},
sortname =
"Name"
,
sortorder =
"asc"
,
rowNum = 10,
rowList =
new
[] { 10, 15, 20 },
pager =
"#pager"
,
viewrecords =
true
,
height =
"auto"
,
width =
"auto"
};
return
Json(
new
{ configs = configs }, JsonRequestBehavior.AllowGet);
}
以上这个Action就是提供导入"模板"配置选项的服务,假设你的View名称为ImportDemo.cshtml的话,那么整个请求用到的代码还应该包括一个MVC打开视图的Action:
public
ActionResult ImportDemo()
{
return
View();
}
最终,只要你开启ImportDemo视图,就会自动到Import服务中获取"模板"
源代码下载
附官方文档,很是对不起,昨晚我说官方没有文档,今天早上来就发现了
Importing
This method reads the grid configuration according to the rules in options and constructs the grid. When constructing the grid for first time it is possible to pass data to it again with the configuration. This is done with jqGirdImport
jQuery("#grid_id").jqGridImport(options);
Where
- grid_id is the id of the table element where the grid should be constructed
- options is array of pair name:value to set different configuration listed bellow
data: “roots>rows”jsonGridobjectdescribes from where to read the json configuration and from where the data if any. The option config describes the configuration tag. The option data describes the data tagconfig : “grid”,
data: “data”ajaxOptionsobjectAdditional options which can be passed to the ajax requestempty object {}
Events
There is only one event which can be called in jqGridImport.
- jqgrid的导入和导出:jqGridImport & jqGridExport
- 数据的导出和导入
- 数据库的导出和导入
- Oracle的导入和导出
- mysql的导入和导出
- mysql的导出和导入
- xml的导入和导出
- 数据库的导入和导出
- 数据库的导出和导入
- 数据的导入和导出
- 资源的导入和导出
- 数据库文件的导入和导出
- mysql的导入和导出
- MySQL的导入和导出
- oracle的导入和导出
- Oracle的导出和导入
- 数据库的导入和导出
- excel的导入和导出
- Unity3d_获取系统地址
- [转载]Oracle Decode函数详解
- 内存堆栈
- Selenium tips
- 图片左右滚动(可自动,有左右按钮)
- jqgrid的导入和导出:jqGridImport & jqGridExport
- PHP xdebug eclipse subversion SVN phpunit xmapp 企业级团队开发环境搭建 集成单元测试 花样调试 版本控制 张迅雷原创 欢迎转载
- hdu 2680 Choose the best route
- s:action标签的使用方法
- 大端小端(Big- Endian和Little-Endian)
- IIS
- 程序员有趣的面试智力题
- [HttpClient] 创建一个HTTP POST 请求 (from Jakarta Commons cookbook 11.7 )
- 用css3和jQuery制作精美的表单