您的位置:首页 > 产品设计 > UI/UE

EasyUI 动态创建对话框Dialog

2017-02-22 21:13 447 查看
// 拒绝审批通过
function rejectApproval() {
// 创建填写审批意见对话框
$("<div id='reject-comment'> </div>").dialog({
title: '请填写拒绝审批通过意见',
closable: true,
width: 350,
height: 250,
content: "<textarea id='input-comment' />",
buttons: [{
text: '确定',
iconCls: 'icon-ok',
handler: function () {
if (canEdit == true) {
var year = parseInt($('#queryYear').numberbox('getValue'));
var month = parseInt($('#queryMonth').numberbox('getValue'));
var comment = $('#input-comment').val();

// 审批意见可能较长,不适合拼接在url中,使用表单传输
var fd = new FormData();
fd.append("comment", comment);

// 后台处理数据时先显示一个提示框,防止用户多次点击【保存】重复提交数据
$.messager.progress({
title: '提示',
msg: '正在保存,请稍候……',
});

$.ajax({
type: "delete",
url: '/api/Approval?year=' + year + '&month=' + month,
processData: false,
contentType: false,
data: fd,
success: function (data) {
if (!data.State) {
$.messager.alert('错误', data.Data, 'warning');
} else {
$('#dg').datagrid('reload');
editRow = -1;
$('#reject-comment').dialog('destroy');
}

$('#dg').datagrid('unselectAll');
},
error: function () {
$.messager.alert('警告', data.Data, 'info');
$('#dg').datagrid('unselectAll');
}
});
}
}
}, {
text: '取消',
iconCls: 'icon-cancel',
// 点击“取消”按钮,销毁对话框
handler: function () {
$('#reject-comment').dialog('destroy');
}
}],
// 点击右上角的“X”图标时
onClose: function () {
$(this).dialog('destroy');
}
});
}


界面是酱紫滴……



PS:记几个
dialog
的用法

获取
dialog
宽高

$('#dlg').dialog('panel').width();
$('#dlg').dialog('panel').height();


更改
dialog
的弹出位置

在弹出
dialog
的时候不用
$('#dialogDiv').dialog('open');
打开。用
$('#dialogDiv').window('open');
打开。再用
window
resize
方法重新布局即可。

var top = 200;
var left = window.innerWidth / 2 - $('#dlg').dialog('panel').width() / 2;
$('#dialogDiv').window('open').window('resize',{width:'250px', height:'500px', top: top, left: left});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  easyui dialog js