Jquery Easy UI初步学习(三)数据增删改
2018-06-23 22:24:26来源:未知 阅读 ()
第二篇只是学了加载用datagrid加载数据,数据的增删改还没有做,今天主要是解决这个问题了。
Pannel 属性
名称 | 类型 | 说明 | 默认值 |
title | string | 显示在Panel头部的标题文字。 | null |
iconCls | string | 在Panel里显示一个16x16图标的CSS类。 | null |
width | number | 设置Panel的宽度。 | auto |
height | number | 设置Panel的高度。 | auto |
left | number | 设置Panel的左边位置。 | null |
top | number | 设置Panel的顶部位置。 | null |
cls | string | 给Panel增加一个CSS类。 | null |
headerCls | string | 给Panel头部增加一个CSS类。 | null |
bodyCls | string | 给Panel身体增加一个CSS类。 | null |
style | object | 给Panel增加自定义格式的样式。 | {} |
fit | boolean | 当设为true时,Panel的 尺寸就适应它的父容器。 | FALSE |
border | boolean | 定义了是否显示Panel的边框。 | TRUE |
doSize | boolean | 设置为true,创建时Panel就调整尺寸并做成布局。 | TRUE |
noheader | boolean | 要是设置为true,Panel的头部将不会被创建。 | FALSE |
content | string | Panel身体的内容。 | null |
collapsible | boolean | 定义了是否显示折叠按钮。 | FALSE |
minimizable | boolean | 定义了是否显示最小化按钮。 | FALSE |
maximizable | boolean | 定义了是否显示最大化按钮。 | FALSE |
closable | boolean | 定义了是否显示关闭按钮。 | FALSE |
tools | array | 自定义工具组,每个工具包含两个特性: | [ ] |
iconCls和handler | |||
collapsed | boolean | 定义了初始化Panel是不是折叠的。 | FALSE |
minimized | boolean | 定义了初始化Panel是不是最小化的。 | FALSE |
maximized | boolean | 定义了初始化Panel是不是最大化的。 | FALSE |
closed | boolean | 定义了初始化Panel是不是关闭的。 | FALSE |
href | string | 一个URL,用它加载远程数据并且显示在Panel里。 | null |
cache | boolean | 设置为true就缓存从href加载的Panel内容。 | TRUE |
loadingMessage | string | 当加载远程数据时在Panel里显示的一条信息。 | Loading… |
extractor | function | 定义了如何从ajax响应抽出内容,返回抽出的数据。 extractor: function(data){ var pattern = /<body[^>]*>((.|[\n\r])*)<\/body>/im; var matches = pattern.exec(data); if (matches){ return matches[1]; // 只抽出 body 的内容 } else { return data; } } |
Pannel 事件
名称 | 参数 | 说明 |
onLoad | none | 当远程数据被加载时触发。 |
onBeforeOpen | none | Panel打开前触发,返回false就停止打开。 |
onOpen | none | Panel打开后触发。 |
onBeforeClose | none | Panel关闭前触发,返回false就取消关闭。 |
onClose | none | Panel关闭后触发。 |
onBeforeDestroy | none | Panel销毁前触发,返回false就取消销毁。 |
onDestroy | none | Panel销毁后触发。 |
onBeforeCollapse | none | Panel折叠前触发,返回false就停止折叠。 |
onCollapse | none | Panel折叠后触发。 |
onBeforeExpand | none | Panel展开前触发,返回false就停止展开。 |
onExpand | none | Panel展开后触发。 |
onResize | width, height | Panel调整尺寸后触发。 |
width:新的外部宽度。 | ||
height:新的外部高度 | ||
onMove | left,top | Panel移动后触发。 |
left:新的左边位置 | ||
Top:新的顶部位置 | ||
onMaximize | none | 窗口最大化后触发。 |
onRestore | none | 窗口还原为它的原始尺寸后触发。 |
onMinimize | none | 窗口最小化后触发。 |
Pannel 方法
名称 | 参数 | 说明 |
options | none | 返回选项特性。 |
panel | none | 返回Panel对象。 |
header | none | 返回Panel头部对象。 |
body | none | 返回Panel身体对象。 |
setTitle | title | 设置头部的标题文字。 |
open | forceOpen | 当forceOpen参数设为true,就绕过onBeforeOpen回调函数打开Panel。 |
close | forceClose | 当forceClose参数设为true,就绕过onBeforeClose回调函数关闭Panel。 |
destroy | forceDestroy | 当forceDestroy参数设为true,就绕过onBeforeDestroy回调函数销毁Panel。 |
refresh | href | 当设置了href特性时,刷新Panel加载远程数据。 |
resize | options | 设置Panel尺寸并做布局。Options对象包含下列特性: |
width:新的Panel宽度 | ||
height:新的Panel高度 | ||
left:新的Panel左边位置 | ||
top:新的Panel顶部位置 | ||
move | options | 移动Panel到新位置。Options对象包含下列特性: |
left:新的Panel左边位置 | ||
top:新的Panel顶部位置 | ||
maximize | none | Panel适应它的容器的尺寸。 |
minimize | none | 最小化Panel。 |
restore | none | 把最大化的Panel还原为它原来的尺寸和位置。 |
collapse | animate | 折叠Panel身体。 |
expand | animate | 展开Panel身体。 |
Window 属性
参数名 | 类型 | 描述 |
modal | boolean | 是否生成模态窗口。默认false |
shadow | boolean | 是否显示窗口阴影。默认false |
Dialog 属性
参数名 | 类型 | 描述 |
title | string | 该对话框标题文本。默认"New Dialog" |
collapsible | boolean | 当True时可显示折叠按钮。默认false |
minimizable | boolean | 当True时可显示最小化按钮。默认false |
maximizable | boolean | 当True时可显示最大化按钮。默认false |
resizable | boolean | 当True时能重绘对话框大小。默认false |
toolbar | array | 该工具栏置于对话框的顶部,每个工具栏包含:text, iconCls, disabled, handler等属性 |
buttons | array | 这个按钮置于对话框的底部,每个按钮包含:text, iconCls, handler等属性 |
修改数据
@model GroupItem.Model.CrmUserEntity <style type="text/css"> tr{ height: 30px;} .td_txt{ text-align:right;} </style> <script type="text/javascript"> function closeForm () { $('#EditDig').dialog('close'); } </script> <form id="toUpdate" method="POST"> <table style="width: 100%; padding: 0 10px;"> <tr> <td width="10" class="td_txt">登陆邮箱:</td> <td width="40">@Html.TextBoxFor(t => t.LoginEmail)</td> <td width="30">@Html.ValidationMessageFor(t=>t.LoginEmail)</td> </tr> <tr> <td class="td_txt">真实姓名:</td> <td>@Html.TextBoxFor(t => t.TrueName)</td> <td>@Html.ValidationMessageFor(t => t.TrueName)</td> </tr> <tr> <td class="td_txt">昵称:</td> <td>@Html.TextBoxFor(t => t.NickName)</td> <td></td> </tr> <tr> <td class="td_txt">手机号码:</td> <td>@Html.TextBoxFor(t => t.Phone)</td> <td></td> </tr> <tr> <td class="td_txt">身份证:</td> <td>@Html.TextBoxFor(t => t.UserCard)</td> <td></td> </tr> <tr> <td class="td_txt">QQ号码:</td> <td>@Html.TextBoxFor(t => t.QQ)</td> <td></td> </tr> <tr> <td class="td_txt">最后登陆时间:</td> <td>@Html.TextBoxFor(t => t.LastLoginTime)</td> <td></td> </tr> <tr> <td colspan="3" style="text-align: center;"> <input type="button" value="保存" onclick="toSubmit()" /> <input type="button" value="取消" onclick=" closeForm() "/> </td> </tr> </table> </form> <script type="text/javascript"> function toSubmit() { var posData = $("#toUpdate").serializeArray(); $.post("/CrmUser/Edit", posData, function (date) { if (date == "ok") { closeForm(); $("#grid").datagrid('reload'); } else { $.messager.alert("友情提示", "操作失败,请您检查", "error"); } }); } </script>
控制器:
/// <summary> /// 用户信息修改 /// </summary> /// <param name="id"></param> /// <returns></returns> public ActionResult Edit(int? id) { var model = new CrmUserEntity(); if (id.HasValue) { model = new CrmUserBll().Get(id.Value); } return View(model); } /// <summary> /// 用户信息修改 /// </summary> /// <param name="crmUser"></param> /// <returns></returns> [HttpPost] [ValidateInput(false)] public ActionResult Edit(CrmUserEntity crmUser) { if (crmUser.Id>0) { //修改 if (new CrmUserBll().Update(crmUser) > 0) { return Content("ok"); } } }
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:C#类的成员初始化顺序
下一篇:服务器的路径
- [原创]jquery更换头像 2020-04-05
- jquery easyui combogrid Uncaught TypeError:Cannot read p 2020-01-07
- jQuery基础之表单验证 2019-12-02
- 图片翻转效果 2019-11-25
- 【新手向】一个超简单的基于jQuery ajax的天气预报Demo 2019-10-08
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash