效果如图:

参见 EasyUI 官方 Demo 及文档

@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
} <script src="~/jquery-easyui-1.4.2/locale/easyui-lang-zh_CN.js"></script>
<table id="datagrid" class="easyui-datagrid" title="" style="width: 100%;"
data-options="rownumbers:true,autoRowHeight:false,pagination:true,toolbar:'#tb',footer:'#ft',fit:true,
pageSize:,singleSelect:true,collapsible:true,url:'@Url.Action("GetGridJSON")',method:'post',fixed:true,
remoteSort:false,onClickCell: onClickCell,onAfterEdit:onAfterEdit,
multiSort:true">
<thead>
<tr>
<th data-options="field:'Id',checkbox:true"></th>
<th data-options="field:'Url',editor:'text'">Url</th>
<th data-options="field:'MenuNo',editor:'text'">MenuNo</th>
<th data-options="field:'MenuLevel',editor:'text'">MenuLevel</th>
<th data-options="field:'MenuName',editor:'text'">MenuName</th>
</tr>
</thead>
</table>
<div id="tb" style="padding: 2px 5px;">
<a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true">增加</a>
@*<a href="#" class="easyui-linkbutton" iconcls="icon-edit" plain="true">修改</a>*@
<a href="#" class="easyui-linkbutton" iconcls="icon-cancel" plain="true">删除</a>
<a href="#" class="easyui-linkbutton" iconcls="icon-xls" plain="true">导出Excel</a>
<a href="#" class="easyui-linkbutton" iconcls="icon-scan" plain="true">扫描添加</a> <select onchange="$('#datagrid').datagrid({singleSelect:(this.value==0)})">
<option value="">选中单行</option>
<option value="">选中多行</option>
</select>
<input class="easyui-textbox" id="MenuNo" value="" name="MenuNo" data-options="prompt:'MenuNo:'" style="height: 22px; width: 120px">
<input class="easyui-textbox" id="url" value="" name="url" data-options="prompt:'url:'" style="height: 22px; width: 120px">
<input class="easyui-textbox" id="MenuName" value="" name="MenuName" data-options="prompt:'MenuName:'" style="height: 22px; width: 120px">
<a href="#" class="easyui-linkbutton" onclick="doSearch()" iconcls="icon-search">查询</a>
<div id="w" class="easyui-window" title="Modal Window" data-options="modal:true,closed:true" style="padding: 10px;">
</div>
</div> <script>
var UrlActionToExcel = "@Url.Action("ToExcel")";
$(document).ready(function () {
$("[iconcls='icon-scan']").click(function () {
$.ajax({
type: "GET",
url: "scan",
async: false, success: function (data) {
doSearch();
parent.showMsgTopCenter("提示", "已经生成" + data + "行记录"); }
});
}); });
</script>
<script type="text/javascript">
$.extend($.fn.datagrid.methods, {
editCell: function (jq, param) {
return jq.each(function () {
var opts = $(this).datagrid('options');
var fields = $(this).datagrid('getColumnFields', true).concat($(this).datagrid('getColumnFields'));
for (var i = ; i < fields.length; i++) {
var col = $(this).datagrid('getColumnOption', fields[i]);
col.editor1 = col.editor;
if (fields[i] != param.field) {
col.editor = null;
}
}
$(this).datagrid('beginEdit', param.index);
for (var i = ; i < fields.length; i++) {
var col = $(this).datagrid('getColumnOption', fields[i]);
col.editor = col.editor1;
}
});
}
}); var editIndex = undefined;
function endEditing() {
if (editIndex == undefined) { return true }
if ($('#datagrid').datagrid('validateRow', editIndex)) {// 检测 数据是否发生 改变
$('#datagrid').datagrid('endEdit', editIndex);// 触发 onAfterEdit 方法
editIndex = undefined;
return true;
} else {
return false;
}
} function onClickCell(index, field, data) {
if (endEditing()) {
$('#datagrid').datagrid('selectRow', index)
.datagrid('editCell', { index: index, field: field, data: data });
editIndex = index;
}
} function onAfterEdit(rowIndex, rowData, changes) {// onAfterEdit 在 rowData 本行数据 ,changes 发生改变的数据
for (change in changes) {
var temp = {};
temp[change] = changes[change];
temp["Id"] = rowData.Id;
temp["MenuLevel"] = rowData.MenuLevel; // 这是 int 类型 ,后台 只排除 string == null,所有要加上
$.ajax({ type: "POST", url: "updateCell", traditional: true, data: temp,//每次 只修改 一行数据中的 某一个字段
async: false, dataType: "json", sunccess: function (data) {//dataType 没有限制
    parent.showMsgTopCenter("提示", "已修改" + data + "行数据");
}
})
}
}
</script>
 public void UpdateCell(Sys_Menu model)
{
ef_Help.ModifyWithOutproNames<Sys_Menu>(model);
Response.Write(db.SaveChanges());
Response.End();
}
public int Scan()
{
var My_Assembly = Assembly.GetExecutingAssembly();// 获得 当前 正在 运行 的程序集
My_Assembly.GetType().GetMethods();
string[] ReturnTyoes = { "ActionResult", "Int32", "String" };//只接收 返回值类型 为 这3中的方法。
var Models = db.Sys_Menu.ToList();// 菜单集合
List<string> UrlArr = new List<string>();// 扫描 Url 集合
foreach (Type type in My_Assembly.GetTypes())//遍历所有 类
{
if (type.Name.Contains("Controller") && type.FullName.Contains("Areas"))// 只扫描 Areas 下的 Controller 类
{
var FullName = type.FullName.Split('.');
var AreaName = FullName[];//获得区域名称
var ControllerName = FullName[].Substring(, FullName[].Length - "Controller".Length);//获得 Control 名称
foreach (var Method in type.GetMethods())//遍历 所有 方法
{
if (ReturnTyoes.Contains(Method.ReturnType.Name) && Method.DeclaringType.Name != "Object")// 排除 基类 Object ,及它的方法
{
var ActionNameAttribute = Method.GetCustomAttributes(typeof(ActionNameAttribute), false);
var MethodName = ActionNameAttribute.Length > ? ((ActionNameAttribute)Method.GetCustomAttributes(typeof(ActionNameAttribute), false)[]).Name : Method.Name;
var Url = string.Format("/{0}/{1}/{2}", AreaName, ControllerName, MethodName);//获得 真实 action (有ActionNameAttribute标记的 ) if (Models.Where(X => X.Url == Url).FirstOrDefault() == null && !UrlArr.Contains(Url))// 排除 已有的Url
{
UrlArr.Add(Url);
}
}
}
}
}
foreach (var url in UrlArr)
{
db.Sys_Menu.Add(new Sys_Menu()
{
MenuLevel = ,
MenuName = "未知",
MenuNo = "未知",
Url = url
});
} return db.SaveChanges();
}

easyui datagrid 单元格编辑 即见即所得,MVC菜单维护,扫描增加的更多相关文章

  1. EasyUI Datagrid 单元格编辑

    3:对于单元格的编辑 $('#Units').datagrid({ pageNumber: 1, //url: "@ViewBag.Domain/Paper/GetQuestionUnit& ...

  2. easyui datagrid 单元格编辑(cell editing)

    demo中有row editing 项目中发现个cell editing,但是有bug,修改好了 主要实现功能:单击数据表格单元格,编辑单元格数据 js代码如下: $.extend($.fn.data ...

  3. easyui datagrid 单元格 编辑时 事件 修改另一单元格

    //datagrid 列数据 $('#acc').datagrid({ columns : [ [ { field : 'fee_lend', title : '收费A', width : 100, ...

  4. easyui datagrid 单元格编辑 自动聚焦 、全选

    $.extend($.fn.datagrid.methods, { editCell: function (jq, param) { return jq.each(function () { var ...

  5. EasyUI datagrid单元格文本超出显示省略号,鼠标移动到单元格显示文本

    nowrap : true;  是前提 $('#×××').datagrid({ nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取 }); 省略号样式: <sty ...

  6. easyui datagrid单元格实现溢出文本显示省略号的效果。

    Css .datagrid-btable .datagrid-cell{padding:6px 4px;overflow: hidden;text-overflow:ellipsis;white-sp ...

  7. easyui datagrid 单元格加进度条(亲测可用)

    {field: 'DataItemNum', title: '数据完整度', width: 100, formatter: function (v, r, i) { var p = (v / 27) ...

  8. Datagrid扩展方法InitEditGrid{支持单元格编辑}

    //-----------------------------------------------------------------/******************************** ...

  9. Datagrid扩展方法onClickCell{easyui-datagrid-扩充-支持单元格编辑}

    //-----------------------------------------------------------------/******************************** ...

随机推荐

  1. Python计算&绘图——曲线拟合问题(转)

    题目来自老师的课后作业,如下所示.很多地方应该可以直接调用函数,但是初学Python,对里面的函数还不是很了解,顺便带着学习的态度,尽量自己动手code. 测试版代码,里面带有很多注释和测试代码: # ...

  2. —教训深刻—SQL Server大约TempDB使用

    场景现象 中午查询了流水,因未与业务人员沟通好.忘了删选条件,导致TempDB不能分配空间,SQL Server高负载执行. 错误分析 我们来看看错误日志: 再来看看TempDB自增长记录: 事件 逻 ...

  3. Xcode 6 AutoLayout Size Classes

    1.基本概念 在iPad和iPhone 5出现之前,iOS设备就唯独一种尺寸. 我们在做屏幕适配时须要考虑的唯独设备方向而已. 而非常多应用并不支持转向,这种话就全然没有屏幕适配的工作了. 随着iPa ...

  4. Android4.2.2由于越来越多的物理按键(frameworks)

    当我们改变frameworks之后可能: make: *** [out/target/common/obj/PACKAGING/checkapi-current-timestamp] 错误 38 解决 ...

  5. Codeforces 459E Pashmak and Graph(dp+贪婪)

    题目链接:Codeforces 459E Pashmak and Graph 题目大意:给定一张有向图,每条边有它的权值,要求选定一条路线,保证所经过的边权值严格递增,输出最长路径. 解题思路:将边依 ...

  6. SQL Server高可用——日志传送(4-3)——使用

    原文:SQL Server高可用--日志传送(4-3)--使用 顺接上一篇:SQL Server高可用--日志传送(4-2)--部署 本文为本系列最重要的一篇,讲述如何使用日志传送及一些注意事项.从上 ...

  7. bootstrap使用汇总

    //大多数功能都能够指定data属性来指定 但是,有必要的情况下使用jquery由于事件是不同的过程 //活动通常有两种状态show shown 通用和过去的 <!DOCTYPE html> ...

  8. SDUT 1265-马停下过河卒(DFS)

    马拦过河卒 nid=24#time" title="C.C++.go.haskell.lua.pascal Time Limit3000ms Memory Limit 65536K ...

  9. SQL入门学习3-数据更新

    4-1 数据的插入(INSERT语句的使用方法) 使用INSERT语句可以向表中插入数据(行).原则上,INSERT语句背刺执行一行数据插入. CREATE TABLE 和INSERT 语句,都可以设 ...

  10. Python脚本传參和Python中调用mysqldump

    Python脚本传參和Python中调用mysqldump<pre name="code" class="python">#coding=utf-8 ...