Dialog上放置Form实例

最新推荐文章于 2021-09-15 17:22:09 发布

wilfuler

最新推荐文章于 2021-09-15 17:22:09 发布

阅读量231

点赞数

文章标签： EXT prototype JSP 工作 HTML

filter.html
[code]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>查询</title>
<link rel="stylesheet" type="text/css" href="css/ext-all.css" />
<script type="text/javascript" src="js/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all.js"></script>
<script type="text/javascript" src="filter.js"></script>
</head>
<body>
<input type="button" id="show-dialog-btn" value="过滤条件" /><br /><br />
<div id="filter-dlg" style="visibility:hidden;">
<div class="x-dlg-hd">过滤条件</div>
</div>
</body>
</html>
[/code]

filter.js
[code]
var Filter = function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';

var dialog, showBtn;

var toggleTheme = function(){
Ext.get(document.body, true).toggleClass('xtheme-gray');
};

return {
init : function(){
showBtn = Ext.get('show-dialog-btn');
showBtn.on('click', this.showDialog, this);
},

showDialog : function(){
if(!dialog){
dialog = new Ext.LayoutDialog("filter-dlg", {
modal:true,
width:600,
height:400,
shadow:true,
minWidth:300,
minHeight:300,
proxyDrag: true,
center: {
autoScroll:true,
tabPosition: 'top',
closeOnTab: true,
alwaysShowTabs: false
}
});

var layout = dialog.getLayout();
layout.beginUpdate();
layout.add('center', new Ext.ContentPanel(Ext.id(), {autoCreate:true, background:true}));
layout.endUpdate();

dialog.addKeyListener(27, dialog.hide, dialog);
dialog.addButton('确定', dialog.hide, dialog);
dialog.addButton('重填', dialog.hide, dialog);

var filter = new Ext.form.Form({
id: 'filter',
labelAlign: 'right',
labelWidth: 80,
url: 'query-sms.jsp'
});

filter.fieldset(
{legend:''},

new Ext.form.DateField({
fieldLabel: '起始时间',
name: 'begin',
width:180,
format:'Y-m-d H:i:s',
allowBlank:false
}),

new Ext.form.DateField({
fieldLabel: '终止时间',
name: 'end',
width:180,
format:'Y-m-d H:i:s',
allowBlank:false
})
);

filter.render(dialog.body);
}
dialog.show(showBtn.dom);
}
};
}();

Ext.EventManager.onDocumentReady(Filter.init, Filter, true);
[/code]

工作中遇到了这个问题，尚未看到相关的例子，今天终于解决了。或许大家会用的到。

wilfuler

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Dialog上放置Form实例

filter.html[code]查询过滤条件 [/code]filter.js[code]var Filter = function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; ...
复制链接

扫一扫