.Net Mvc实现各种表格随意切换插件
一套Js代码，。只要改参数 在3种表格之间任意切换-（使用Js面向对象封装,可重写方法）
任意表格皮肤随便切换 flextgrid/bootstrapt/jqgrid
1 |
001 |
@{ |
002 |
Layout = null; |
003 |
} |
004 |
005 |
<!DOCTYPE html> |
006 |
007 |
<html> |
008 |
<head> |
009 |
<meta name="viewport" content="width=device-width" /> |
010 |
<title>Test</title> |
011 |
</head> |
012 |
<body> |
013 |
014 |
015 |
|
016 |
<input type="button" value="查询" onclick="curmodelCRUD.search();" /> |
017 |
|
018 |
019 |
|
020 |
<table id="grid" ></table> |
021 |
022 |
023 |
|
024 |
025 |
026 |
027 |
@Html.Action("Index", "TableGrid", new |
028 |
{ |
029 |
adminType = ViewBag.Type, |
030 |
skin = "default" |
031 |
}) |
032 |
033 |
<script> |
034 |
035 |
var curmodelCRUD; |
036 |
$(function () { |
037 |
var modelCRUD = baseCRUD.extend({ |
038 |
/*渲染列表*/ |
039 |
initList: function () { |
040 |
var columns = [ |
041 |
{ |
042 |
field: 'userid', |
043 |
title: '用户Id', |
044 |
width: "200" |
045 |
}, { |
046 |
field: 'username', |
047 |
title: '用户名', |
048 |
width: "200", |
049 |
align: "center", |
050 |
formatter: function (value, row, index) { |
051 |
return value; |
052 |
} |
053 |
}, { |
054 |
field: 'departmentname', |
055 |
title: '部门', |
056 |
align: "center", |
057 |
width: "200", |
058 |
formatter: function (value, row, index) { |
059 |
return value; |
060 |
} |
061 |
}, { |
062 |
field: 'mobilephone', |
063 |
align: "center", |
064 |
title: '手机', |
065 |
width: "200", |
066 |
formatter: function (value, row, index) { |
067 |
|
068 |
return value; |
069 |
} |
070 |
} |
071 |
072 |
]; |
073 |
var options = { |
074 |
id: "#grid", |
075 |
url: "@ViewBag.pluginsName/Content/test.json", |
076 |
columns: columns, |
077 |
showcheckbox:true, |
078 |
onClickRow: function (row) { |
079 |
080 |
} |
081 |
}; |
082 |
this.base(options); |
083 |
}, |
084 |
searchParm:function(){ |
085 |
var param = { |
086 |
status: 1 |
087 |
}; |
088 |
return param; |
089 |
}, |
090 |
search: function () { |
091 |
this.base({ params: this.searchParm }); |
092 |
} |
093 |
}); |
094 |
curmodelCRUD = new modelCRUD(); |
095 |
curmodelCRUD.initList(); |
096 |
}); |
097 |
098 |
099 |
function getsel() { |
100 |
101 |
} |
102 |
103 |
|
104 |
</script> |
105 |
106 |
</body> |
107 |
</html> |
flextgrid版本
bootstrapt版本
jqgrid版本
EasyUI版本
bootstrapt tree 表格
支持搜索的z-tree树
.Net Mvc实现各种表格随意切换插件的更多相关文章
- 推荐几款jquery图片切换插件
一.前言 毕业季到了,大家都在匆匆忙忙的记录大学里最美好的时光,照片中各种花式.各种姿势都涌现出来了.这么多的照片怎么展示出来给自己的好友看呢?有人选择做成视频,有人选择ps之后做成图片集,而我选择利 ...
- FlexSlider jQuery滑动切换插件 参数
demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...
- 支持10种格式的 HTML 表格导出 jQuery 插件
HTML 表格导出 jQuery 插件可以帮助用户导出 HTML 表格到 JSON.XML.PNG.CSV.TXT.SQL.MS-Word.MS-Excel.MS-PowerPoint 和 PDF 格 ...
- 基于jQuery的对象切换插件：soChange 1.5 (点击下载)
http://www.jsfoot.com/jquery/demo/2011-09-20/192.html 所有参数: $(obj).soChange({ thumbObj:null, //导 ...
- ExtJS4.2学习(13)基于表格的扩展插件---rowEditing
鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-24/182.html --------------- ...
- FlexSlider是一个非常出色的jQuery滑动切换插件
FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所有初级和高级网页设计师使用.不过很多人都只是使用默认的参数,今天来说说具体的参数来给大家看看 ...
- jQuery图片切换插件jquery.cycle.js
Cycle是一个很棒的jQuery图片切换插件,提供了非常好的功能来帮助大家更简单的使用插件的幻灯功能 下载cycle插件并引入,此时,注意把引入它的代码放在引入jQuery主文件之后. <he ...
- Java实现随意切换VPN改变上网地区
http://www.jb51.net/article/69267.htm 这篇文章主要介绍了Java实现随意切换VPN改变上网地区,本文直接给出实例代码,需要的朋友可以参考下 在很多情况下,有些网络 ...
- 转发-基于ASP.NET MVC 4/5 Razor的模块化/插件式架构实现
基于ASP.NET MVC 4/5 Razor的模块化/插件式架构实现 概述 在日常开发中, 我们经常谈起模块化/插件化架构,这样可既可以提高开效率,又可以实现良好的扩展性,尤其对于产品化的系统有 ...
随机推荐
- 服务器运行环境部署（PHP）
1.使用的是腾讯云服务器,系统为centOS: 2.LAMP环境配置查看:https://cloud.tencent.com/document/product/213/8043: 3.mysql-se ...
- 微服务（二）hystrix
特性 1.延迟和失败容忍 防止级联错误,错误回退,优雅降级.快速失败和恢复 线程和信号量隔离 2.实时监控和配置更改 3.并发 并行执行,请求缓存,自动批处理失败请求 总运行流程 当你发出请求后,hy ...
- Android的ListView
ListView ListView 是一个控件,一个在垂直滚动的列表中显示条目的一个控件,这些条目的内容来自于一个ListAdapter. 一个简单的例子 布局文件里新增ListView <Li ...
- 最大流当前弧优化Dinic模板
最大流模板: 普通最大流 无向图限制:将无向图的边拆成2条方向相反的边 无源汇点有最小流限制的最大流:理解为水管流量形成循环,每根水管有流量限制,并且流入量等于流出量 有源汇点的最小流限制的最大流 顶 ...
- Spring Boot中使用Swagger2构建API文档
程序员都很希望别人能写技术文档,自己却很不愿意写文档.因为接口数量繁多,并且充满业务细节,写文档需要花大量的时间去处理格式排版,代码修改后还需要同步修改文档,经常因为项目时间紧等原因导致文档滞后于代码 ...
- mybatis 详解（五）------动态SQL
前面几篇博客我们通过实例讲解了用mybatis对一张表进行的CRUD操作,但是我们发现写的 SQL 语句都比较简单,如果有比较复杂的业务,我们需要写复杂的 SQL 语句,往往需要拼接,而拼接 SQL ...
- ABP+AdminLTE+Bootstrap Table权限管理系统第七节--登录逻辑及abp封装的Javascript函数库
经过前几节,我们已经解决数据库,模型,DTO,控制器和注入等问题.那么再来看一下登录逻辑.这里算是前面几节的一个初次试水. 首先我们数据库已经有的相应的数据. 模型和DTO已经建好,所以我们直接在服务 ...
- 浅谈JS中的高级函数
在JavaScript中,函数的功能十分强大.它们是第一类对象,也可以作为另一个对象的方法,还可以作为参数传入另一个函数,不仅如此,还能被一个函数返回!可以说,在JS中,函数无处不在,无所不能,堪比孙 ...
- python基础===zip在python3中的用法
name=["ad","kein","tom"] age=[23,45,22] tel=['157','139','167'] print( ...
- 学问Chat UI(2)
前言 上文讲了下要去做哪些事,重点分析了融云Sdk中RongExtension这个扩展控件,本文来学习下同样是融云Sdk中的AutoRefreshListView如何适配多种消息的实现方式,写的有不足 ...