Extjs Ext Js面板对齐问题
这是我的外部面板和外部窗口 这是编辑器网格面板Extjs Ext Js面板对齐问题,extjs,Extjs,这是我的外部面板和外部窗口 这是编辑器网格面板 voiceListingEditorGrid = new Ext.grid.EditorGridPanel({ id: 'voiceListingEditorGrid', store: voiceDataStore, cm: voiceColumnModel, enableColLock:false, resize: false, autoload: true, clicksToEdit:2, sm: co
voiceListingEditorGrid = new Ext.grid.EditorGridPanel({
id: 'voiceListingEditorGrid',
store: voiceDataStore,
cm: voiceColumnModel,
enableColLock:false,
resize: false,
autoload: true,
clicksToEdit:2,
sm: colSM,
selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),
tbar: [
{
text: 'Add a site',
tooltip: 'Add a new site',
iconCls:'add',
handler: displayFormWindow
}, '-', {
text: 'Delete selection',
tooltip: 'Select a record from table and delete',
handler: confirmDeleteSite, // Confirm before deleting
iconCls:'remove'
}]
});
这是分机窗口
voiceListingWindow = new Ext.Window({
id: 'voiceListingWindow',
title: 'Sites',
draggable : false,
resizable: false,
closable: false,
width:805,
height:500,
plain:true,
layout: 'fit',
items: voiceListingEditorGrid
});
数据存储
voiceDataStore = new Ext.data.Store({
id: 'voiceDataStore',
proxy: new Ext.data.HttpProxy({
url: 'database.php',
method: 'POST'
}),
// these parameters are passed for any HTTP request
baseParams:{
task: "VOICELISTING",
user_id : user_id_param
},
reader: new Ext.data.JsonReader({
root: 'results',
totalProperty: 'total',
id: 'id'
},[
{name: 'queue_code', type: 'string', mapping: 'queue_code'},
{name: 'site_name', type: 'string', mapping: 'site_name'} ,
{name: 'queue_id', type: 'int' , mapping: 'queue_id'}
]),
sortInfo:{field: 'queue_id', direction: "ASC"}
});
模型
voiceColumnModel = new Ext.grid.ColumnModel(
[
/*{
header: 'ID',
dataIndex: 'queue_id'
},*/
colSM,
{
header: 'Site Name',
dataIndex: 'site_name',
width:330,
editor: new Ext.form.TextField({
allowBlank: false,
maxLength: 20,
regex: /[a-zA-Z0-9]+/
})
},{
header: 'Site Number',
dataIndex: 'queue_code',
width:310,
editor: new Ext.form.TextField({
allowBlank: false,
maxLength: 20,
maskRe: /([0-9\s]+)$/ ,
regex: /[0-9]/
})
},{
header: 'Add Call Queue',
align: 'center',
width: 124,
sortable: false,
//renderer: function(val){ return '<input type="button" onclick="redirect();" value="Add Call Queue" id="'+val+'"/>'; },
renderer: function(val){ return '<input type="image" alt="Add Call Queue" id="'+val+'" src="images/plus.png" name="Add Call Queue" onclick="redirect();" >' ; },
dataIndex: 'user_id'
}
]
);
voiceColumnModel=新的Ext.grid.ColumnModel(
[
/*{
标题:“ID”,
dataIndex:'队列\u id'
},*/
colSM,
{
标题:“站点名称”,
dataIndex:'站点名称',
宽度:330,
编辑器:新建Ext.form.TextField({
allowBlank:false,
最大长度:20,
正则表达式:/[a-zA-Z0-9]+/
})
},{
标题:“站点编号”,
dataIndex:'队列\u代码',
宽度:310,
编辑器:新建Ext.form.TextField({
allowBlank:false,
最大长度:20,
maskRe:/([0-9\s]+)$/,
正则表达式:/[0-9]/
})
},{
标题:“添加呼叫队列”,
对齐:'居中',
宽度:124,
可排序:false,
//呈现程序:函数(val){返回“”;},
呈现程序:函数(val){返回“”;},
dataIndex:“用户\u id”
}
]
);
这是PHP文件
<?php
session_start();
if(!isset($_SESSION['validuser'])){
header( "Location: http://localhost/vcc" );
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>VCC</title>
<link rel="stylesheet" type="text/css" href="customeStyle.css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css"/>
<script type="text/javascript" src="adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-all.js"></script>
<script type="text/javascript" src="voicesite.js"></script>
<script type="text/javascript" >
function goBack(){
//history.back();
window.location ="http://didyouwonder.com/vcc/users.php";
}
</script>
</head>
<body>
<div id="contianerVoice">
<div id="logoffbtn1">
<a href="logout.php" ><img src="images/signout.gif" alt="Logout" /></a>
</div>
<h1>Account Name: <?php echo $_GET['account_name']?></h1>
<div id="footerVoice">
<div id="left-footer">
<a href="#" onclick="goBack();" ><img src="images/back1.png" alt="Back" /></a>
</div>
<div id="right-footer">
<div id="rdiv">
<ul>
<li><img src="images/plus.png"/><span> Add Voice Site</span></li>
<li><img src="images/enable.png"/><span> Enable</span></li>
<li><img src="images/disable.png"/><span> Disable</span></li>
</ul>
</div>
<div id="ldiv">
<ul>
<li><img src="images/add.gif"/><span> Add</span></li>
<li><img src="images/delete.gif"/><span> Delete</span></li>
<li> Double click to Edit</span></li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
VCC
函数goBack(){
//历史。返回();
window.location=”http://didyouwonder.com/vcc/users.php";
}
帐户名:
- 添加语音站点
- 使能
- 禁用
- 加
- 删除
- 双击进行编辑
请参阅所附图片,然后阅读下面的说明
页面加载时页面布局良好
这就是firebug窗口打开并刷新页面时发生的情况。
加载页面时,网格显示正常。问题是,当我打开firebug窗口并刷新页面时,网格会转到顶部,当我在Mac上打开页面时也会发生同样的事情。我不知道如何处理这个问题,因为这是我第一次使用Ext
请提出建议。好的,我已经解决了这个问题。。。这是一个符合我目的的计划。这里有一个使用这个插件的例子。仔细阅读文档,然后阅读示例 但一开始它对我不起作用,原因是ext窗口容器,它正在渲染网格面板。所以我从代码中删除了这个
voiceListingWindow = new Ext.Window({ ...
现在,栅格面板将根据栅格面板的此属性进行渲染
... renderTo: 'reportTabContent' // render the grid to the specified div in the page
没有错误,但不是完整的代码。请提供完整的代码…我认为问题在于渲染。在哪里渲染此窗口?也许你有一些绝对坐标…它是在PHP文件中呈现的。我已经更新了代码,请看一下。谢谢