-
ext 查看某条记录的详细信息,我想另外弹出一个页面显示,该如何写5
ext gird 列的某一列,根据编号 显示详细信息;
在windows 里 套用一个ext.from.frompanel 时,当表单大时,显示不全,是因为焦点的问题?还是什么呢
如图1,2
所以我想新建一个也页面显示 ,专门 用来显示 详细信息。
不知道该怎么做了,请指教,谢谢
问题补充:yonglin4605 写道那你就用<a href='' target='_blank'></a> 来弹出页面显示就好了啊。
我也这样想,但是不知道改怎么做,查看详细信息,要通过id 在后台进行查询 完事显示 不知道改怎么写 请指教
问题补充:helencabell 写道你要实现的功能是这样吗?
点击查看详细按钮的时候,获得grid中选中行的数据,创建一个formpanel,然后把它放到window中,显示窗口。
大体的代码是:
var win = new Ext.Window({
id: "xxx",
title: "xxx",
layout: 'fit',
width: 350, // 指定窗口宽度,根据表单项目自己修改
height: 280, // 指定窗口高度,根据表单项目自己修改
resizable: false,
modal: true, // 以模态方式显示
items: formpanel
});
win.show();
是我写得这样,没错吧!
从你的抓图2来看,formpanel被查询客户的tabpanel挡住了,这个层的关系应该是不正确的,formpanel所在的窗口应该是在最上层的。
至于表单项目很多,显示不下时,应该指定Window的大小,并在formpanel的配置选项中使用autoScroll: true,显示滚动条。
对,那么 这个层的关系该如何设置呢?
问题补充:helencabell 写道按我刚才说的那样写得话,就不会有层的问题。
选中grid行,点击"查看详细"按钮,在按钮的点击事件里这么写:
var grid = Ext.getCmp(gridId);
var selRecord = grid.getSelectionModel().getSelected();
if (selRecord == null || selRecord == '') {
return;
}
var id = selRecord.data["id"];
Ext.Ajax.request({
method: 'POST',
url: "xxx",// 查询数据的URL
params: {
id: id
},
success: function(response, option) {
// 创建formpanel...
var win = new Ext.Window({
id: "xxx",
title: "xxx",
layout: 'fit',
width: 350,
height: 280,
resizable: false,
modal: true,
items: formpanel
});
win.show();
},
failure: function(response, option) {
}
});
红字的部分自己修改一下
还是不行啊?啊啊啊啊 .........
问题补充:helencabell 写道按我刚才说的那样写得话,就不会有层的问题。
选中grid行,点击"查看详细"按钮,在按钮的点击事件里这么写:
var grid = Ext.getCmp(gridId);
var selRecord = grid.getSelectionModel().getSelected();
if (selRecord == null || selRecord == '') {
return;
}
var id = selRecord.data["id"];
Ext.Ajax.request({
method: 'POST',
url: "xxx",// 查询数据的URL
params: {
id: id
},
success: function(response, option) {
// 创建formpanel...
var win = new Ext.Window({
id: "xxx",
title: "xxx",
layout: 'fit',
width: 350,
height: 280,
resizable: false,
modal: true,
items: formpanel
});
win.show();
},
failure: function(response, option) {
}
});
红字的部分自己修改一下
还是不行啊?是不是formpanel 里哪里不对啊
问题补充:helencabell 写道能把你那部分代码贴出来吗?我看看
var LookForm = new Ext.FormPanel({
reader: Userreader,
baseCls: 'x-plain',
labelWidth: 55,
defaultType: 'textfield',
labelAlign: 'left',
resizable: false,
modal: true,
frame:true,
bodyStyle:'padding:5px 5px 0',
items:[{
xtype:'fieldset', title:'客户自身情况',collapsible:true,height:180,
items:[{layout:'column',border:false, labelSeparator:' ',
items:[{
columnWidth:.5, layout: 'form', labelSeparator:' ', labelStyle: 'text-align:right;width:60;', border:false,
items: [{
cls : 'key',xtype:'textfield',fieldLabel: '客户名称',name: 'name', editable:false,anchor:'90%'
}]
},{
columnWidth:.5, layout: 'form', labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
border:false,
items: [{
cls : 'key',xtype:'textfield', fieldLabel: '客户地址', name: 'addr',anchor:'90%'
}]
}]
}, {
layout:'column',
border:false,
labelSeparator:' ',
items:[{
columnWidth:.5, layout: 'form', labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
border:false,
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '客户性质',
name: 'property',
anchor:'90%'
}]
},{
columnWidth:.5,
layout: 'form', labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
border:false,
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '所属行业',
name: 'belong',
anchor:'90%'
}]
}]
}, {
layout:'column',
border:false, labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
labelSeparator:' ',
items:[{
columnWidth:.5, layout: 'form',labelSeparator:' ',
border:false,
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '客户规模',
name: 'size',
anchor:'90%'
}]
},{
columnWidth:.5,
layout: 'form', labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
labelSeparator:' ',
border:false,
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '经营状况',
name: 'status',
anchor:'90%'
}]
}]
},{
layout:'column',
border:false, labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
labelSeparator:' ',
items:[{
columnWidth:1, layout: 'form',
border:false,
labelSeparator:' ',
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '经营范围',
name: 'scope',
anchor:'95%'
}]
}]
}, {
layout:'column',
border:false, labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
labelSeparator:' ',
items:[{
columnWidth:1, layout: 'form',labelSeparator:' ',
border:false,
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '主营项目',
name: 'main_item',
anchor:'95%'
}]
}]
}, {
layout:'column',
border:false, labelSeparator:' ', labelStyle: 'text-align:right;width:60;',
labelSeparator:' ',
items:[{
columnWidth:1, layout: 'form',labelSeparator:' ',
border:false,
items: [{
cls : 'key',
xtype:'textfield',
fieldLabel: '业务流程',
name: 'flow',
anchor:'95%'
}]
}]
}
]}
// ]}
],
buttons:[{
text:'关闭',
handler:function(){
LookForm.getForm().reset();
newFormWin.hide();
} }]
});
var selectedKeys = grid.selModel.selections.keys;
var id = grid.selModel.selections.keys;
alert(id)
if (selectedKeys.length!= 1) {
Ext.Msg.alert('提示', '请选择一条记录!');
} else {
Ext.Ajax.request({
method: 'POST',
url: "/PJYD/jsp/customer/customer_manager.jsp",// 查询数据的URL ?id=+id
params: {
id: id
},
success: function(response, option) {
var win = new Ext.Window({
id: 'xxx',
layout: 'fit',
width: 800,
height:800,
resizable: false,
modal: true,
title: '查看客户详细信息',
items: LookForm
});
win.show();
},
failure: function(response, option) {
}
});
} 麻烦你了,谢谢!
问题补充:helencabell 写道去掉reader: Userreader,
reader: Userreader 是用来显示数据的,我不是做查看吗?
问题补充:窗口高度 大点好使吗?因为表单内容很多,550 是肯定不够的!
helencabell 写道除了数据之外,我这里已经都能正常显示了。
你的代码我整理了一下,窗口高度我改成550了,把Userreader的定义加上,取id的部分你再修改一下就可以了。
var selectedKeys = grid.selModel.selections.keys;
var id = grid.selModel.selections.keys;// id取得不正确
if (selectedKeys.length != 1) {
Ext.Msg.alert('提示', '请选择一条记录!');
} else {
Ext.Ajax.request({
method: 'POST',
url: "/PJYD/jsp/customer/customer_manager.jsp",// 查询数据的URL ?id=+id,既然用POST了,就没有必要再用问号传值了,用下面的params就可以
params: {
id: id
},
success: function(response, option) {
// var Userreader;
var LookForm = new Ext.FormPanel({
reader: Userreader,
baseCls: 'x-plain',
labelWidth: 55,
defaultType: 'textfield',
labelAlign: 'left',
frame: true,
bodyStyle: 'padding: 5px 5px 0',
items: [{
xtype: 'fieldset',
title: '客户自身情况',
collapsible: true,
height: 180,
items: [{
layout: 'column',
border: false,
items: [{
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户名称',
name: 'name',
editable: false,
anchor: '90%'
}]
}, {
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户地址',
name: 'addr',
anchor: '90%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户性质',
name: 'property',
anchor: '90%'
}]
}, {
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '所属行业',
name: 'belong',
anchor: '90%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户规模',
name: 'size',
anchor: '90%'
}]
}, {
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '经营状况',
name: 'status',
anchor: '90%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: 1,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '经营范围',
name: 'scope',
anchor: '95%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: 1,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '主营项目',
name: 'main_item',
anchor: '95%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: 1,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '业务流程',
name: 'flow',
anchor: '95%'
}]
}]
}]
}],
buttons: [{
text: '关闭',
handler: function(){
LookForm.getForm().reset();
win.close();
}
}]
});
var win = new Ext.Window({
layout: 'fit',
width: 800,
height: 550,
resizable: false,
modal: true,
title: '查看客户详细信息',
items: LookForm
});
win.show();
},
failure: function(response, option) {
}
});
}
2010年2月21日 21:04
11个答案 按时间排序 按投票排序
-
采纳的答案
fieldset的宽度也控制一下,就不会有横向滚动条了。
var LookForm = new Ext.FormPanel({
reader: Userreader,
autoScroll: true,
defaults: {
width: 740
},
// baseCls: 'x-plain',
...
});
2010年2月23日 13:57
-
如果分辨率按照1024*768计算的话,去掉浏览器工具栏等等的高度,大概也就只能设置成550左右,在LookForm里加上autoScroll: true,去掉baseCls: 'x-plain',项目过多的时候就会显示滚动条。
var LookForm = new Ext.FormPanel({
reader: Userreader,
autoScroll: true,
// baseCls: 'x-plain',
...
});2010年2月23日 13:34
-
除了数据之外,我这里已经都能正常显示了。
你的代码我整理了一下,窗口高度我改成550了,把Userreader的定义加上,取id的部分你再修改一下就可以了。
var selectedKeys = grid.selModel.selections.keys;
var id = grid.selModel.selections.keys;// id取得不正确
if (selectedKeys.length != 1) {
Ext.Msg.alert('提示', '请选择一条记录!');
} else {
Ext.Ajax.request({
method: 'POST',
url: "/PJYD/jsp/customer/customer_manager.jsp",// 查询数据的URL ?id=+id,既然用POST了,就没有必要再用问号传值了,用下面的params就可以
params: {
id: id
},
success: function(response, option) {
// var Userreader;
var LookForm = new Ext.FormPanel({
reader: Userreader,
baseCls: 'x-plain',
labelWidth: 55,
defaultType: 'textfield',
labelAlign: 'left',
frame: true,
bodyStyle: 'padding: 5px 5px 0',
items: [{
xtype: 'fieldset',
title: '客户自身情况',
collapsible: true,
height: 180,
items: [{
layout: 'column',
border: false,
items: [{
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户名称',
name: 'name',
editable: false,
anchor: '90%'
}]
}, {
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户地址',
name: 'addr',
anchor: '90%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户性质',
name: 'property',
anchor: '90%'
}]
}, {
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '所属行业',
name: 'belong',
anchor: '90%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '客户规模',
name: 'size',
anchor: '90%'
}]
}, {
columnWidth: .5,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '经营状况',
name: 'status',
anchor: '90%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: 1,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '经营范围',
name: 'scope',
anchor: '95%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: 1,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '主营项目',
name: 'main_item',
anchor: '95%'
}]
}]
}, {
layout: 'column',
border: false,
items: [{
columnWidth: 1,
layout: 'form',
labelSeparator: ' ',
labelStyle: 'text-align: right;width: 60;',
border: false,
items: [{
cls: 'key',
xtype: 'textfield',
fieldLabel: '业务流程',
name: 'flow',
anchor: '95%'
}]
}]
}]
}],
buttons: [{
text: '关闭',
handler: function(){
LookForm.getForm().reset();
win.close();
}
}]
});
var win = new Ext.Window({
layout: 'fit',
width: 800,
height: 550,
resizable: false,
modal: true,
title: '查看客户详细信息',
items: LookForm
});
win.show();
},
failure: function(response, option) {
}
});
}2010年2月23日 11:45
-
按我刚才说的那样写得话,就不会有层的问题。
选中grid行,点击"查看详细"按钮,在按钮的点击事件里这么写:
var grid = Ext.getCmp(gridId);
var selRecord = grid.getSelectionModel().getSelected();
if (selRecord == null || selRecord == '') {
return;
}
var id = selRecord.data["id"];
Ext.Ajax.request({
method: 'POST',
url: "xxx",// 查询数据的URL
params: {
id: id
},
success: function(response, option) {
// 创建formpanel...
var win = new Ext.Window({
id: "xxx",
title: "xxx",
layout: 'fit',
width: 350,
height: 280,
resizable: false,
modal: true,
items: formpanel
});
win.show();
},
failure: function(response, option) {
}
});
红字的部分自己修改一下2010年2月22日 16:50
-
你根据ID拼出一个url来啊
<a href='page.jsp?id=yourId'></a>
你应该是用grid了,给你参考一下{header:'操作',dataIndex:'operate',renderer:function(value,metadata,record){ var name=record.get("name"); var id=record.get('id'); return '<a href=# onclick="alert(\''+id+'\')">弹出</a>'; }}
2010年2月22日 10:40
-
你要实现的功能是这样吗?
点击查看详细按钮的时候,获得grid中选中行的数据,创建一个formpanel,然后把它放到window中,显示窗口。
大体的代码是:
var win = new Ext.Window({
id: "xxx",
title: "xxx",
layout: 'fit',
width: 350, // 指定窗口宽度,根据表单项目自己修改
height: 280, // 指定窗口高度,根据表单项目自己修改
resizable: false,
modal: true, // 以模态方式显示
items: formpanel
});
win.show();
是我写得这样,没错吧!
从你的抓图2来看,formpanel被查询客户的tabpanel挡住了,这个层的关系应该是不正确的,formpanel所在的窗口应该是在最上层的。
至于表单项目很多,显示不下时,应该指定Window的大小,并在formpanel的配置选项中使用autoScroll: true,显示滚动条。2010年2月22日 10:25
相关推荐
-一个典型应用,在Window控件中打开新页面,如果传递的参数不正确,则首先提示参数不对然后关闭此弹出窗口。 -ExtAspNet.Alert.Show("参数错误!", String.Empty, ExtAspNet.ActiveWindow.GetCloseReference());...
最后利用一个商品信息管理系统和一个企业任务管理系统,向读者演示了ExtJS在实际项目中的应用以及实现流程。 《精通JS脚本之ExtJS框架》附有配套光盘,提供了书中实例的源代码和视频教学文件。此外,读者还可以...
-一个典型应用,在Window控件中打开新页面,如果传递的参数不正确,则首先提示参数不对然后关闭此弹出窗口。 -ExtAspNet.Alert.Show("参数错误!", String.Empty, ExtAspNet.ActiveWindow.GetCloseReference());...
我该如何贡献? 注意Saladict是一个免费的开源项目,仅用于学习目的。 任何人都可以免费获得Saladict的副本。 如果您认为自己的合法权利受到侵犯,请立即与联系。 Saladict已获得许可。 您可以免费使用源代码,只要...
最后利用一个商品信息管理系统和一个企业任务管理系统,向读者演示了ExtJS在实际项目中的应用以及实现流程。 《精通JS脚本之ExtJS框架》附有配套光盘,提供了书中实例的源代码和视频教学文件。此外,读者还可以...
要的是,Linux 上有公认的 C 语言世界最好的编译器 gcc,如果你想得到一个效率更高的开 发环境(并不一定是最友好的,但一定是最强大的),我建议你一定要好好的熟悉一下 Linux。 三.如何得到Linux? 据我所知...
步骤1)如果在安装新版本的CMS TYPO3系统时弹出错误“ @ mysqli.reconnect = 1 @”,请在文件中注释此消息:“ typo3 / sysext / install / Classes / SystemEnvironment / DatabaseCheck /Driver/Mysqli.php”。...
065 如何创建一个弹出式菜单? 066 如何设计自定义快捷菜单? 067 如何在对话框类型的应用程序中加载菜单? 068 如何获取菜单栏高度? 069 如何取消应用程序菜单栏? 070 如何取消对菜单状态的限制? 071 如何确定顶层菜单...
一般在AndroidManifest.xml中添加了android:windowSoftInputMode=adjustResize或者adjustPan的话,页面中包含EditText控件进入时会自动弹出软件盘。 1.在包含EditText的父布局中添加android:focusable=true和android...
- 你可以把他当做管理linux的一个操作系统界面 - 可以用来作为私有云存储系统,存储你的文件... - 当然你也可以用来分享文件 - Web IDE / browser code editor awesomeness - 更多场景等你来挖掘!…… #### 3....
https://github.com/amazedkoumei/chrome-ext-my-halatebu-search-in-(谷歌改变历史记录---------------------------------2012.05.03 v0.1.1新发布2012.08.05 v0.1.2错误修正2013.05.31 v0.1.3将弹出窗口中的链接...
正在做一个gwt项目的开发,我会把在项目开发中遇到的问题以及解决方法记录下来(有很多是同事,也整理放在其中了),以供同道中人参考,少走不该走的路,也希望与同仁交流。 gwt的1.4发布了,好久没有更新我的文章...