.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的模块化/插件式架构实现 概述 在日常开发中, 我们经常谈起模块化/插件化架构,这样可既可以提高开效率,又可以实现良好的扩展性,尤其对于产品化的系统有 ...
随机推荐
- Linux系统C语言socket tcp套接字编程
1.套接字的地址结构: typedef uint32_t in_addr_t; //32位无符号整数,用于表示网络地址 struct in_addr{ in_addr_t s_addr; //32位 ...
- Uva140 Bandwidth 全排列+生成测试法+剪枝
参考过仰望高端玩家的小清新的代码... 思路:1.按字典序对输入的字符串抽取字符,id[字母]=编号,id[编号]=字母,形成双射 2.邻接表用两个vector存储,存储相邻关系 ...
- 分布式事务,EventBus 解决方案:CAP【中文文档】
前言 很多同学想对CAP的机制以及用法等想有一个详细的了解,所以花了将近两周时间写了这份中文的CAP文档,对 CAP 还不知道的同学可以先看一下这篇文章. 本文档为 CAP 文献(Wiki),本文献同 ...
- 关于Wifi室内定位应用中的一些问题：
公司目前在办公室内布设了一套室内定位的实验环境,用的是华为路由器,采用的算法是基于信号强度的RSSI算法.公司目前希望能使用这套设备得到无线网络覆盖范围下的所有移动设备(对应每个人)的MAC地址,同时 ...
- Linux 粘着位（sticky bit）
当设置粘着位时只有root或者owner才能删除.重命名文件. 示例: 用户apple默认组为fruit. [root@titan ~]# id apple uid=1001(apple) gid=1 ...
- 【python密码学编程】5.反转加密法
#Reverse Cipher message = 'there can keep a secret,if two of them are dead.' translated = '' i = len ...
- 巧用tab组件实现APP的布局效果
1. 版本说明 iOS/Android支持版本 jar包版本 8.4及往后版本 2017年4月1日 2. 描述 tab布局能避免多层次钻取与返回,可以在一个报表内部进行切换,钻取层数如果过多的话,看报 ...
- mybatis 详解（十一）------ mybatis和spring整合
想要整合mybatis和spring,那么我们首先要知道这两个框架是干嘛的,对于mybatis我们前面几篇博客已经有了很详细的介绍,我们通过加载mybatis-configuration.xml 文件 ...
- python基础===Python 代码优化常见技巧
Python 代码优化常见技巧 代码优化能够让程序运行更快,它是在不改变程序运行结果的情况下使得程序的运行效率更高,根据 80/20 原则,实现程序的重构.优化.扩展以及文档相关的事情通常需要消耗 8 ...
- Linux学习总结（七）—— CentOS软件包管理：脚本安装
脚本安装就是软件编写者写好一个shell脚本或者java脚本,你只需要输入一些简单的信息便可直接安装.这种安装方式方便简单,类似于Windows下软件的安装方式. 下面以webmin的安装为例讲解脚本 ...