EasyUI简单CRUD
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="keywords" content="jquery,ui,easy,easyui,web" />
<meta name="description" content="easyui help you build your web page easily!" />
<title>短信管理</title>
<link href="../Scripts/easyui/themes/default/easyui.css" rel="stylesheet" />
<link href="../Scripts/easyui/themes/icon.css" rel="stylesheet" />
<link href="../Scripts/easyui/demo/demo.css" rel="stylesheet" />
<style type="text/css">
#fm {
margin: 0;
padding: 10px 30px;
}
.ftitle {
font-size: 14px;
font-weight: bold;
color: #666;
padding: 5px 0;
margin-bottom: 10px;
border-bottom: 1px solid #ccc;
}
.fitem {
margin-bottom: 5px;
}
.fitem label {
display: inline-block;
width: 80px;
}
</style>
<script type="text/javascript" src="../Scripts/easyui/jquery.min.js"></script>
<script type="text/javascript" src="../Scripts/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../Scripts/easyui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
var url;
function newUser() {
$('#dlg').dialog('open').dialog('setTitle', '添加短信');
$('#fm').form('clear');
url = "/OnlineMonitoring/ashx/MSGMgr.ashx?type=insert";
}
function editUser() {
var row = $('#dg').datagrid('getSelected');
if (row) {
$('#dlg').dialog('open').dialog('setTitle', '编辑短信内容');
$('#fm').form('load', row);
url = "/OnlineMonitoring/ashx/MSGMgr.ashx?type=update";
} else {
parent.$.messager.alert('提示', '请选择一行', "info");
}
}
function saveUser() {
$('#fm').form('submit', {
url: url,
onSubmit: function () {
return $(this).form('validate');
},
success: function (result) {
var result = eval('(' + result + ')');
if (result.result) {
$('#dlg').dialog('close'); // close the dialog
$('#dg').datagrid('reload'); // reload the user data
} else {
$.messager.show({
title: '服务端错误',
msg: "添加失败"
});
}
}
});
}
function removeUser() {
var row = $('#dg').datagrid('getSelected');
if (row) {
parent.$.messager.confirm('操作提示', '你确定删除这条短信吗？', function (r) {
if (r) {
$.post("/OnlineMonitoring/ashx/MSGMgr.ashx?type=delete", { short_message_id: row.short_message_id }, function (result) {
if (result.result) {
$('#dg').datagrid('reload'); // reload the user data
} else {
$.messager.show({ // show error message
title: '服务端错误',
msg: "删除短信失败"
});
}
}, 'json');
}
});
}
}
</script>
</head>
<body class="easyui-layout">
<div data-options="region:'center',fit:true,border:false" style="height: 100%">
<table id="dg" title="短信管理" class="easyui-datagrid"
url="/OnlineMonitoring/ashx/MSGMgr.ashx?type=select"
toolbar="#toolbar" pagination="false"
rownumbers="true" fitcolumns="true" singleselect="true" fit="true" method="get">
<thead>
<tr>
<th field="short_message_content" width="50" align="center">短信内容</th>
<th field="short_message_time" width="50" align="center">短信创建时间</th>
<th field="short_message_state" width="50" align="center" formatter="messageFormater">短信状态</th>
</tr>
</thead>
</table>
</div>
<div id="toolbar">
<a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true" onclick="newUser()">添加</a>
<a href="#" class="easyui-linkbutton" iconcls="icon-edit" plain="true" onclick="editUser()">编辑</a>
<a href="#" class="easyui-linkbutton" iconcls="icon-remove" plain="true" onclick="removeUser()">删除</a>
</div>
<div id="dlg" class="easyui-dialog" style="width: 400px; height: 280px; padding: 10px 20px"
closed="true" buttons="#dlg-buttons">
<div class="ftitle">短信信息</div>
<form id="fm" method="post" novalidate>
<input type="hidden" name="short_message_id" />
<div class="fitem">
<label>短信内容:</label>
<input name="short_message_content" class="easyui-validatebox" required="true">
</div>
</form>
</div>
<div id="dlg-buttons">
<a href="#" class="easyui-linkbutton" iconcls="icon-ok" onclick="saveUser()">确认</a>
<a href="#" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">取消</a>
</div>
</body>
</html>
<style type="text/css">
.panel-title {
text-align: center;
font-size: 20px;
}
#sex {
width: 50px;
}
</style>
<script>
function messageFormater(val) {
if (val == 1) {
return "已发送";
} else {
return "未发送";
}
}
</script>
EasyUI简单CRUD的更多相关文章
- 使用Struts2和jQuery EasyUI实现简单CRUD系统（转载汇总）
使用Struts2和jQuery EasyUI实现简单CRUD系统(一)——从零开始,ajax与Servlet的交互 使用Struts2和jQuery EasyUI实现简单CRUD系统(二)——aja ...
- MongoDB简单CRUD场景
MongoDB简单CRUD命令操作 (1)新建数据库:use 数据库名 (2)显示所有数据库:show dbs; (3)新建集合(两种方式) 隐式创建:在创建集合的同时往集合里面添加数据---db. ...
- 使用Struts2和jQuery EasyUI实现简单CRUD系统（七）——数据分页处理
上篇完毕多选删除的功能之后,接下来就是做分页功能了.曾经的分页是一个麻烦的问题.并且数据量巨大的时候,直接把这些元素取出来显然速度较慢,所以取一定区间的数据还是高效的. watermark/2/tex ...
- 使用Struts2和jQuery EasyUI实现简单CRUD系统（五）——jsp,json,EasyUI的结合
这部分比較复杂,之前看过自己的同学开发一个选课系统的时候用到了JSON,可是一直不知道有什么用.写东西也没用到.所以没去学他.然后如今以这样的怀着好奇心,这是做什么用的,这是怎么用的.这是怎么结合的心 ...
- SSM——（二）：easyUI的CRUD
1.在WebContent下新建admin目录,添加index.html(用来显示user表的CRUD): 总结: 1.datagrid接收的必须是json数据: 2.使用分页插件会自动向后台传递St ...
- SequoiaDB 系列之二 ：SequoiaDB的简单CRUD操作
上一篇通过一系列的操作,终于把SequoiaDB的集群部署到单台机器上了. 建议去安装体验一下吧. 在整个环境的部署的体验来看,并没有MongoDB的部署简单,但是比MongoDB的部署要清晰.Mon ...
- easyui简单使用
easyui近期一直都比较流行,虽然它在效果上被extjs爆了,它的使用难度低,在IE6下表现不错,的确受到了广泛企业程序员的好评. 但是他的API说明还是比较简陋的,刚上手可能还需要摸索一下,为什么 ...
- Servlet实现简单CRUD
1.首先在数据库中建表 create database student create table stu( sno char(10), sna char(10), ) insert stu value ...
- Easyui简单布局
1.创建布局 创建布局只需要添加 'easyui-layout' class 到 <div> 标记或者 在整个页面创建布局,即<body class="easyui-lay ...
随机推荐
- 解决Android NDK 报jxxx编译找不到
如题 解决: 引入NDK对应的arm或者x86库 如果你用的是GinyMotion模拟器,那就引入x86库 不多说了,见截图 1.选择Propertities->C/C++ General-&g ...
- [Unity3D]场景间切换与数据传递(以及物体删除技巧)
http://blog.163.com/kingmax_res/blog/static/77282442201031712216508/ 先介绍一些基本函数(具体用法自己查文档):---------- ...
- java设计模式之模板方法
转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/8744002 今天你还是像往常一样来上班,一如既往地开始了你的编程工作. 项目经理告 ...
- java数据库编程：JDBC操作及数据库
掌握JDBC操作步骤, 掌握数据库驱动程序配置 可以使用JDBC进行数据库连接. JDBC本身是一个标准,因此操作步骤是固定的,以后只需要修改很少代码就可以达到不同数据库间连接转换功能. 操作步骤: ...
- iOS 滑块拼图游戏（Puzzle8）
代码地址如下:http://www.demodashi.com/demo/11505.html 一.准备工作 先了解一个定义和定理 定义:在一个1,2,...,n的排列中,如果一对数的前后位置与大小顺 ...
- .Net 程序员面试 C# 语言篇 (回答Scott Hanselman的问题)
过去几年都在忙着找项目,赶项目,没有时间好好整理深究自己在工作中学到的东西.现在好了,趁着找工作的这段空余时间,正好可以总结和再继续夯实自己的.Net, C#基本功.在05年的时候,Scott Han ...
- Mysql暴错注入代码-webshell
MySql Error Based Injection Reference[Mysql暴错注入参考]Author:Pnig0s1992Mysql5.0.91下测试通过,对于5+的绝大部分版本可以测 ...
- Jetty - Container源码分析
1. 描述 Container提供管理bean的能力. 基于Jetty-9.4.8.v20171121. 1.1 API public interface Container { // 增加一个bea ...
- redis命令_INCR
INCR key 将 key 中储存的数字值增一. 如果 key 不存在,那么 key 的值会先被初始化为 0 ,然后再执行 INCR 操作. 如果值包含错误的类型,或字符串类型的值不能表示为数字,那 ...
- ny82 迷宫寻宝（一） map+queue
题目地址:http://acm.nyist.net/JudgeOnline/problem.php?pid=82 AC代码:讲解,先统计在可搜索范围内对应的钥匙数,把搜到的门存到另外的一个队列中,第一 ...