EasyUi – 6.easyui常见问题
1.进度条
2.JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法
3. 三张表的连接查询现在到datagrid里
4.日期组合框DateBox设置readonly的解决方法
1.进度条
//数据更新
$('#A3').click(function () { $.messager.progress({
title:
'请稍后', msg: '页面加载中...'
});
$.post("Update.ashx", $("#EditForm").form().serialize(),
function (msg) {
//alert(msg);
if (msg != 0) {
//刷新当前页reload
_datagrid.datagrid('reload', {
DeviceNumber: '',
});
$.messager.show({
title: '提示',
msg: "更新" + msg + "条数据！",
showType: 'show'
});
setTimeout(function
() { $.messager.progress('close'); }, 100
);
} else { $.messager.show({
title: '提示',
msg: "没有更新！",
showType: 'show'
});
setTimeout(function
() { $.messager.progress('close'); }, 100
);
} }, 'json');
2.JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法
var dlg = $('#dd').dialog({
title: '导入excel,请选择..',
width: ,
height: ,
closed: true,
cache: false,
modal: true,
//href: '../UpLoad.aspx'
});
//在点击按钮打开Dialog时，将div append到form里，使按钮生效。
dlg.parent().appendTo(jQuery("#form1"));
//导入excel
$('#A2').click(function () {
dlg.dialog('open');
//console.info(dlg.parent());
});
html
<form id="form1" runat="server">
<div id="dd">
<div>
<div id="fileQueue" style="margin-left: 20px">
<p>
<asp:FileUpload ID="FileUpload_excel" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</p>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</div>
</div>
</form>
解决方法：在点击按钮打开Dialog时，将div append到form里，使按钮生效。
将弹出div append到属于form里的div，那么服务器端控件就可以正常执行
3. 三张表的连接查询现在到datagrid里
3.1 存储过程：
------------------------------------
--用途：查询PKE_DeviceContent与PKE_Franchiser还有PKE_DeviceNumber的3张表的连接查询
--项目名称：
--说明：查询PKE_DeviceContent多余的数据
--时间：2013-09-08 20:11:23
------------------------------------
ALTER PROCEDURE [dbo].[PKE_DeviceContent_Select]
@GetOne nvarchar(50)
AS
select a.ConID,a.DeviceNumber,a.longitude,a.latitude,a.AlarmStatus,a.uploadtime,
a.vehicleState,a.PositionStatus,a.BeginTime,a.EndTime,a.Adderss,b.FranchiserName,c.Remark from
PKE_DeviceNumber b
inner join dbo.PKE_Franchiser c
on
c.FranchiserName=b.FranchiserName
inner join PKE_DeviceContent a
on
a.DeviceNumber=b.DeviceNumber
where a.DeviceNumber like '%'+@GetOne+'%'
3.2 页面
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PKE_DeviceContent.aspx.cs" Inherits="Easyui.Web.PKE_DeviceContent.PKE_DeviceContent" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>设备列表</title>
<script src="../Scripts/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>
<script src="../Scripts/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>
<link href="../Scripts/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet">
<link href="../Scripts/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" />
<script src="../Scripts/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"></script>
<script src="../Scripts/date.js"></script>
<link href="../css/cxlb.css" rel="stylesheet" />
<script type="text/javascript">
var LoginInputForm;
var _datagrid;
$(function () {
_datagrid = $('#datagrid').datagrid({
//传递额外的参数
queryParams: {
GetOneID: '',
PassWord: '',
},
url: 'PKE_DeviceContent.ashx',
rownumbers: true,//显示行号
idField: '设备号',//支持翻页后（记忆）——例：跨页删除
//fitColumns: true,//设置为true将自动使列适应表格宽度以防止出现水平滚动。
pagination: true,
nowarp: false, //内容换行：false（换） true（不换）
//fit:true, //自适应
pageSize: 10,
loadMsg: "努力加载中...",
singleSelect: true,
pageList: [10, 20, 30],
//toolbar: [{
// text: '新增',
// iconCls: 'icon-add', //}, '-', {
// text: '修改',
// iconCls: 'icon-edit',
//}, '-', {
// text: '删除',
// iconCls: 'icon-remove',
//}, '-', {
// text: '取消多选',
// iconCls: 'icon-redo',
//}
//],
columns: [[
{ field: 'ConID', title: '序列号', width: 100 },
{ field: 'Remark', title: '客服', width: 150 },
{
field: 'DeviceNumber',
title: '设备号',
width: 100,
},
{ field: 'AlarmStatus', title: '报警状态', width: 150 },
{ field: 'vehicleState', title: '车辆状态', width: 150 },
{ field: 'PositionStatus', title: '定位状态', width: 150 },
{ field: 'uploadtime', title: '上传时间', width: 150 },
{ field: 'BeginTime', title: '开通时间', width: 150 },
{ field: 'EndTime', title: '到期时间', width: 150 },
{
field: 'Adderss', title: '操作', width: 100,
formatter: function (value, row, index) {
return '<a style="cursor:pointer;" onclick="show(' + index + ')">详细</a>';
}
}
]],
loadFilter: function (data) {
//console.info(data.rows);
if (data.rows=="004") {
$.messager.alert('Warning', '您的权限已经过期！\n 请重新登录！！');
} else {
return data;
}
}
}); //查询
$('#btn').click(function () {
_datagrid.datagrid('load', {
GetOneID: $('#cx_lb').find("[name='username']").val(),
//PassWord: $('#cx_lb').find("[name='PassWord']").val(),
});
}); //清空
$('#A1').click(function () {
_datagrid.datagrid('load', {
GetOneID: '',
});
$('#cx_lb').find('input').val('');
}); $.extend($.fn.validatebox.defaults.rules, {
minLength: {
validator: function (value, param) {
return value.length >= param[0];
},
message: 'Please enter at least {0} characters.'
}
}); }); function show(i) {
var row = _datagrid.datagrid('getRows');
console.info(row[i]);
$(".pageFormContent").dialog({
title: '详细记录',
closable: true,
modal: true,
buttons: [{
text: '添加',
iconCls: 'icon-ok',
handler: function () {
//***先验证（根据自己的需求）
//if (LoginInputForm.form('validate')) {
//1.表单form提交
//LoginInputForm.submit(); //2.ajax提交
$.ajax({
type: "POST",
url: "Add.ashx",
dataType: "json",
data: $('#LoginInputForm').form().serialize(), success: function (msg) {
//alert(msg);
if (msg == "1") {
$("#LoginAndRegDialog").dialog("close");
_datagrid.datagrid('load', {
UserName: '',
});
$.messager.show({
title: '提示',
msg: "添加成功！"
});
} else if (msg == "0") {
//alert($("#LoginInputForm input[name='name']").val());
$.messager.show({
title: '提示',
msg: "账号【" + $("#LoginInputForm input[name='name']").val() + "】已经存在，请重新填写！"
});
} }
});
//}
}
}]
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
</form>
<div class="easyui-layout" fit="true">
<div data-options="region:'north',title:'查询列表',split:true" class="datagrid-toolbar" style="height: 75px;">
<form id="cx_lb">
<table class="cx_lb_table">
<tr>
<th>设备号：</th>
<td width="200">
<input type="text" name="username" /></td>
<td>
<a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a>
</td>
<td>
<a id="A1" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'">清空</a>
</td>
</tr>
</table>
</form>
</div>
<div data-options="region:'center',title:'本地设备列表'" style="padding: 5px; background: #eee;">
<table id="datagrid"></table>
</div> </div> </body>
</html>
3.3 一般处理程序PKE_DeviceContent.ashx
using System;
using System.Collections;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.SessionState;
using Newtonsoft.Json.Linq; namespace Easyui.Web.PKE_DeviceContent
{
/// <summary>
/// PKE_DeviceContent1 的摘要说明
/// </summary>
public class PKE_DeviceContent1 : IHttpHandler, IRequiresSessionState
{
private HttpRequest Request;
private DataSet ds;
private string json; public void ProcessRequest(HttpContext context)
{ Request = context.Request;
int rows = int.Parse(Request["rows"]);
int page = int.Parse(Request["page"]);
string getOne = Request["GetOneID"];
//session 账号
//string username = Convert.ToString(context.Session["username"]);
string username = "tangge";
//验证账号
//if (string.IsNullOrEmpty(username))
//{
// context.Response.Write("{\"rows\":\"004\"}");
//}
//else
//{
context.Response.ContentType = "text/html";
SqlParameter[] parameters =
{
new SqlParameter("@GetOne", SqlDbType.VarChar, ),
};
parameters[].Value = getOne; DataSet ds = DBUtility.DbHelperSQL.RunProcedure("PKE_DeviceContent_Select", parameters,
"PKE_DeviceContent"); json = DBUtility.JsonConvert.DatasetToJson(ds); JObject jObj = JObject.Parse(json);
JToken ageToken = jObj["total"];
int total = int.Parse(ageToken.ToString()); //转化为Jarray
JArray jconte = (JArray) jObj["rows"]; //names：返回所有Remark（客服姓名）
//var names = from staff in jObj["rows"].Children()
// select (string)staff["Remark"];
var remark = jObj.SelectToken("rows").Select(p => p["Remark"]).ToList();
; //设置行数：相当于total(如：客服tangge,数量5个，cou就等于5)
int cou = ;
//设置内容：把(remark[y].ToString() == username)的remark添加进去
ArrayList contelist = new ArrayList(); for (int y = ; y < remark.Count; y++)
{
if (remark[y].ToString() == username)
{
cou++;
contelist.Add(((remark[y].Parent)).Parent);
}
} ArrayList list = new ArrayList(); string tt = null;
//如果page是第1页and总数小于行数（例：总数4，行数10）
if (page == && cou <= rows)
{
//根据前台 rows 得到 content
for (int i = ; i < rows - (rows - cou); i++)
{
list.Add(contelist[i]);
} foreach (var cc in list)
{
tt += cc + ",";
}
} //page是第1页 and 总数大于行数（例：总数11，行数10）
else if (page == && cou > rows)
{
//根据前台 rows 得到 content
for (int i = ; i < rows; i++)
{
list.Add(contelist[i]);
} foreach (var cc in list)
{
tt += cc + ",";
}
}
//page不等于1 and 总数大于行数
else if (page != && cou > rows)
{
//行数乘以页数减去总数大于0，说明：（总数：31，页数：4，显示最后1行）
if (rows*page - total > )
{
for (int i = (page - )*rows; i < cou; i++)
{
list.Add(contelist[i]);
} foreach (var cc in list)
{
tt += cc + ",";
}
}
//行数乘以页数减去总数小于等于0，（总数：31，页数：2，显示10行）
else if (rows*page - cou <= )
{
for (int i = (page - )*rows; i < rows*page; i++)
{
list.Add(contelist[i]);
} foreach (var cc in list)
{
tt += cc + ",";
}
} }
if (total == )
{
context.Response.Write(json);
}
else
{
string jsonstring = "{\"total\":" + cou + ",\"rows\":[" + tt.ToString() + "]}";
context.Response.Write(jsonstring.Remove(jsonstring.Length - , ));
}
//}
//}
} public bool IsReusable
{
get
{
return false;
}
}
}
}
4.日期组合框DateBox设置readonly的解决方法。
//继承自combo，使用combo的editable属性设置readonly.
$("#BeginTime").datebox({ editable: false });
//$("#Content input[name='BeginTime']").attr('readonly', 'readonly');
$("#EndTime").datebox({ editable: false });
//$("#Content input[name='EndTime']").attr('readonly', 'readonly');
EasyUi – 6.easyui常见问题的更多相关文章
- SpringMVC +mybatis+spring 结合easyui用法及常见问题总结
SpringMVC +mybatis+spring 结合easyui用法及常见问题总结 1.FormatString的用法. 2.用postAjaxFillGrid实现dataGrid 把form表单 ...
- 【easyui】—easyui教你编写一个前台的架子
以前做项目都是在别人搭建好的环境下直接编写单独的页面,也没有处理过怎么搭建一个框架.看到别人的布局都挺好的,自己也想做一个走一下流程. 嘿,刚开始时看着别人写的代码,去找怎么写. 这是我自己的想法,使 ...
- EasyUI datagrid easyui datagrid +dialog 加载 可直接运行 七
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...
- 杂项： EasyUI | jQuery EasyUI
ylbtech-杂项-JS: EasyUI | jQuery EasyUI jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助web开发者更轻 ...
- EasyUI介绍及常见问题
JQuery Easy UI介绍 1.JQuery Easy UI环境搭建和调试: https://jingyan.baidu.com/article/67508eb4342f9f9cca1ce426 ...
- EasyUi – 6.easyui常见问题
1.进度条 2.JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法 3. 三张表的连接查询现在到datagrid里 4.日期组合框DateBox设置readonly ...
- 【Asp.Net使用EasyUI】EasyUI combox实现联动
很多时候都会用到combox的联动效果,选择上一个combox的值就自动带出这个值对应的其它信息,比如省市联动,最近我也刚好遇到了类似的要求,是用EasyUI combobox 控件完成的,如果是A ...
- [easyui] - 在easyui的table中展示提示框
因为在easyui的table中字段过多,而无法展示全时,被迫只能使用这个方法. 使用方式: 在 $('#dg').datagrid({ 后的 queryParams: form2Json('sear ...
- 【EasyUI】——EasyUI的布局
做一个站点首先要有站点的布局,所谓的布局事实上就是网页的排版.就是说你的网页显示时是什么样子的. 就比方百度的首页: 无论是谁登录.网页都是这个样式的. EasyUI中的网页布局一共分为五部分,分别为 ...
随机推荐
- Spatial pyramid pooling (SPP)-net （空间金字塔池化）笔记（转）
在学习r-cnn系列时,一直看到SPP-net的身影,许多有疑问的地方在这篇论文里找到了答案. 论文:Spatial Pyramid Pooling in Deep Convolutional Net ...
- BZOJ 1485: [HNOI2009]有趣的数列
Description 求长度为 \(2n\) 的序列.要求 1. \(a_1<a_3<a_5<...<a_{2n-1}\) . 2. \(a_2<a_4<a_6& ...
- 关于mysql安全
修改root用户密码: update mysql.user set password=password('new_passwd') where user='root'; flush privilege ...
- Javaweb Servlet出现Class xxx is not a servlet错误原因
- discuz后台开发常用函数
showsetting()表单显示 返回值:无 参数: $setname - 指定输出标题,如:setting_basic_bbname, 自动匹配描述文字为:setting_basic_bbname ...
- linux 终端报错 Out of memory: Kill process[PID] [process name] score问题分析
从Out of memory来看是内存超出了,后面的 Kill process[PID] [process name] score好像和进程有关了,下面我们就一起来看看linux 终端报错 Out o ...
- Linux CAT与ECHO命令详解 <<EOF EOF
Linux CAT与ECHO命令详解 cat命令是Linux下的一个文本输出命令,通常是用于观看某个文件的内容的: cat主要有三大功能: .一次显示整个文件. $ cat filename .从键盘 ...
- ccf559c
题意:给出一个矩阵棋盘,大小不超过10^5.上面有n个非法点(n<=2000)不可以踩,从左上角开始走到右下角,每次只能向下或者向右移动.问有多少种走法.结果对10^9+7取模. 分析: 组合数 ...
- ios Swift 一些注意事项
func test(one:NSString) -> NSString{ return "aaa" } func test(one:Int) -> NSString{ ...
- bbs/贴吧/盖楼的技术实现(PHP)
2015年3月5日 14:36:44 更新: 2015年7月18日 16:33:23 星期六 目标, 实现类似网易盖楼的功能, 但是不重复显示帖子 效果: * 回复 //1楼 ** 回复 //1楼的子 ...