easyui dialog 和 dategrid相关设置与应用
1 dialog一些参数 可以进行文件上传等操作
closed:true;定义初始状态为关闭;
modal:true;对话框被打开时,会有一个modal-mask,使得对话框底部的内容被一个层覆盖,
不能进行其他操作(多个对话框时可能存在模态框覆盖不全,部分内容仍然可以操作的)
html文件 <div id="dlgImport" class="easyui-dialog" closed="true" title="Import Excel">
<form action="" method="post" enctype="multipart/form-data">
Excel File:<input class="easyui-filebox" name="file" style="width:300px"><br/>
<input type="submit" value="Sumbit">
<span id="import-tip" style="display: none">importing...</span>
</form>
</div> js文件
$('#btnImport').click(function(){
$('#dlgImport').dialog('open')
});
$('#dlgImport form').ajaxForm({
dataType:'json',
beforeSubmit:function(){
$.messager.alert('Notice','processing...');
},
success:function(data){
$.messager.alert('Notice','Import excel file success');
$('#dlgImport').dialog('close');
setTimeout(function(){
$(".messager-body:first").window('close');
},100);
queryTable(Params());
},
error:function(data){
setTimeout(function(){
$(".messager-body:first").window('close');
},100);
$.messager.alert('Notice','Import excel file failed!');
queryTable(Params());
}
});
2 dategrid 数据表格初始化
html <div class="easyui-layout" >
<table id="tt" rownumbers="true" pagination="true"></table>
</div> js function queryTable(params) {
$('#tt').datagrid({
width: $(".queryTable").width()+60,
height:($(window).height()-200), //将window--》document页面大小变动时将会被刷新,这样设定宽高流出页面分页
singleSelect:true,
queryParams: params||{},
loadMsg: "Loading, please wait ...",
pageList: [15,25,35,45,65,100],
idField:'id',
rownumbers:false, //行号隐藏
nowrap:false, //每个单元格进行换行
url:" ",
fitColumns:true, //列宽自适应,需要有至少一列设定固定宽度方可生效
columns:[[
{field: 'code',title:'Code',width:8%},
{field: 'classify',title:'Classify'},
{field: 'status',title:'Status',align:'center',formatter:function(val,obj,idx){
var rtn='';
if(val!=0&&val==''){
rtn='';
}else{
switch(val){
case 0:
rtn='unaccept';
break;
case 1:
rtn='process';
break;
case 2:
rtn='refuse';
break;
case 3:
rtn='complete';
break;
case 5:
rtn='cancel';
break;
case 4:
rtn='expire';
break;
}
}
return rtn;
}},
{field: 'dd',title:'Dd'},
{field: 'operator',title:'Operator',,formatter:function(value,obj,index){
var html="<a href='#' onclick='updateA("+obj+",update)'>Update</a>";
html+=" | <a href='#' onclick='updateFBStatus("+obj+",view)'>View</a>";return html;}
}
]]
});
$('#tt').datagrid("clearSelections"); }
表格行的上下移动:https://blog.csdn.net/u014488113/article/details/53435740
3 修改和更新等可以利用easyui-window实现 http://www.jeasyui.net/plugins/180.html
4 文件导出
//当导出的文件都是由后台写好,则根据接口可以直接进行导出
$('#btnExport').click(function(){
var params = Params();
window.location='urll?'+ jQuery.param(params);
});
5 获取datagrid所有行数据
var rows = $("#tt").datagrid("getRows");
for(var i=0;i<rows.length;i++){
seriesArr.push(rows[i].id);
}
easyui dialog 和 dategrid相关设置与应用的更多相关文章
- 窗口-EasyUI Window 窗口、EasyUI Dialog 对话框、EasyUI Messager 消息框
EasyUI Window 窗口 扩展自 $.fn.panel.defaults.通过 $.fn.window.defaults 重写默认的 defaults. 窗口(window)是一个浮动的.可拖 ...
- Easyui dialog中嵌入iframe
如果easyui dialog的地址属性用href超链接,easyui 不会加载整个url页面,只会截取url目标页的body体间的html, 如果想加载把其他页面 加载进dialog的iframe中 ...
- Xcode 生成静态库相关设置:
Xcode 生成静态库相关设置: #Build Setting1. Architectures ------- Architectures -----> $(ARCHS_STANDARD) -- ...
- Eclipse相关设置与优化
原文:http://chaoxz2005.blog.163.com/blog/static/15036542013411105519685/ 一般在不对eclipse进行相关设置的时候,使用eclip ...
- zend studio 9.0.4 破解、汉化和字体颜色及快捷键相关设置
转载:http://www.penglig.com/post-45.html 下载:http://www.geekso.com/component/zendstudio-downloads/ 破解:h ...
- 使用VIRTUALBOX安装ANDROID系统 | 图文教程 | 相关设置
使用VIRTUALBOX安装ANDROID系统 | 图文教程 | 相关设置 http://icaoye.com/virtualbox-run-android/
- jquery.util.easyui.dialog
(function ($) { var $parent = parent.$; //获取弹出窗口数据集合 function getDialogs() { var dialogs = $parent(& ...
- 关于myeclipse中maven项目转换相关设置
关于myeclipse中maven项目转换相关设置 在myeclipse菜单中,Configure->Convert to Maven Project 这个菜单 如果没有的话,需要做如下设置: ...
- [Other] 自定义MIME类型支持FLV的相关设置
刚测试知道为何服务器无法播放flv的原因,特此记录而已. 网络空间支持FLV的相关设置,就是自定义一个MIME类型,一般虚拟主机管理里面都有这个选项 自定义MIME类型 扩展名: .flv MIME类 ...
随机推荐
- eclipse卡,相关优化配置
配置eclipse.ini文件 -vmargs -Xms1024m-Xmx3072m-Dfile.encoding=UTF-8 该行设置编码 启动卡window--preferences搜索s ...
- vue-devtools : vue的调试工具及log显示工具 vconsole
使用 devtools 有很多好处,比如它可以让你能够实时编辑数据属性并立即看到其反映出来的变化.另一个主要的好处是能够为 Vuex 提供时间旅行式的调试体验. 注意:请留意如果页面使用了一个生产环境 ...
- 匹配整个img路径
<script>var regex=/^(<img src=")(.+)(">)/;var src='<img src="file:///D ...
- 配置android.support.v7.widget.Toolbar 搜索框样式
AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xm ...
- mac 安装geckodriver和chromedriver
Last login: Fri Apr :: on ttys000 (base) localhost:~ ligaijiang$ env TERM_PROGRAM=Apple_Terminal SHE ...
- windows server 2008 R2如何更换系统界面语言/中文换英文
下面我们来讲解一下如何将中文系统转化成日文.韩文.英文等其它语言界面的系统. 以windows server 2008 R2系统中文变英文为例: 1.到微软官方下载:Windows Server 20 ...
- php curl POST multipart/form-data与application/x-www-form-urlencode的区别
背景 CURL在 a.php 中以 POST方式向 b.php 提交数据,但b.php无法接收到数据,而 CURL 操作显示成功. 原来,"传递一个数组到CURLOPT_POSTFIELDS ...
- 微信支付相关js
import $ from "jquery" /*支付功能开始*/let ip="";let nonceStr;let appId;let mchId;let ...
- windows连接远程win服务器失败,win7win10都存在此问题,显示出现身份验证错误,要求的函数不受支持,可能由于CredSSP加密Oracle修正 (原)
之前电脑windows+mstsc连接另一个windows服务器正常登陆,可在更新本地系统为win10以后,登陆就出现了问题,提示的错误是,出现身份验证错误.要求的函数不受支持,可能由于CredSSP ...
- gitlab8.2->8.16->8.17->9.0升级
注:不要跨过8.16升级至8.17,这样做升级过程会报错 ###################################8.2升级至8.16########################## ...