当前位置: 代码迷 >> Ajax >> Ext window
  详细解决方案

Ext window

热度:574   发布时间:2012-02-10 21:27:41.0
Ext window - Web 开发 / Ajax
<%@ page language="java" pageEncoding="GB2312"%>
<html> 
<head>
<title>图书管理</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" type="text/css" href="../js/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="../js/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../js/ext/ext-all.js"></script>
  <script type="text/javascript" src="../js/ext/source/widgets/grid/ColumnModel.js"></script>
  <script type="text/javascript" src="../js/ext/source/data/Store.js"></script>
  <script type="text/javascript" src="../js/ext/source/widgets/PagingToolbar.js"></script>
<script>
Ext.onReady(function(){
//Ext.MessageBox.alert('测试','测试成功');
var sm=new Ext.grid.CheckboxSelectionModel();
var cm=new Ext.grid.ColumnModel([
{header:"code",dataIndex:"id",sortable:true},  
{header:"name",dataIndex:"name"},
{header:"birthday",dataIndex:"birthday"},
{header:'sex',dataIndex:"sex"},
{header:'xueli',dataIndex:'xueli'},
{header:'quanxian',dataIndex:'quanxian'},
{header:'web',dataIndex:'web'},
{header:'email',dataIndex:'email'}
]);

  var ds = new Ext.data.Store({
  proxy: new Ext.data.HttpProxy({url:'source.jsp'}),
  reader: new Ext.data.JsonReader({totalProperty:'totalProperty',root:'root'}, [
  {name: 'id'},
  {name: 'name'},
  {name: 'birthday'},
  {name: 'sex'},
  {name: 'xueli'},
  {name: 'quanxian'},
  {name: 'web'},
  {name:'email'}
   
  ])
  });
  

   
var grid=new Ext.grid.GridPanel({
 
ds:ds,
cm:cm,
width:810,
height:180,
 
bbar:new Ext.PagingToolbar({
pageSize:5,
store:ds,
displayInfo:true,
displayMsg:'显示第{0}条到{1}条记录,一共{2}条',
emptyMsg:"没有记录"
})
});
   

ds.load({params:{start:0,limit:5}});
  //grid.render();
   
   
  
  
  
  var formPanel=new Ext.form.FormPanel({
  title:'text',
  buttonAlign:'right',
  //bodyStyle:'padding:5px',
  width: 820,
  frame:true,
  labelWidth:80,
  items:[grid],
  buttons:[
  {text:'新 建',handler:newDate},
  {text:'修 改',handler:modifyDate},
  {text:'删 除',handler:deleteDate}]
  });
  formPanel.render(document.body);
   
  function newDate()
  {
  alert("新建");
  var win = new Ext.Window({
title: '新建',
xtype:'window',
  modal: 'true', 
  width:800,
  height:250,
collapsible : true,//是否可以折叠
closable : true,//是否可以关闭
maximizable : true,//是否可以最大化 
  closeAction:'hide',
  plain: true,
  items:[{html:formText.jsp}]

});
   
  }
   
  function modifyDate()
  {
  alert("modify");
  相关解决方案