PDA

View Full Version : Ext.Window????????????Window?????????



hatsu1119
11 Jun 2010, 6:57 AM
grid??????????????????????????????????????????????????????????????
???????? ?????


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="extjs/3.2/resources/css/ext-all.css">
<script type="text/javascript" src="extjs/3.2/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/3.2/ext-all-debug.js"></script>
<script type="text/javascript">
var gridPanel;
var myStore = [
["value11", "value12"],
["value21", "value22"]
];
var panelWidth = 700;var panelHeight = 500;
Ext.onReady( function(){
gridPanel = new Ext.grid.GridPanel({
width: panelWidth,
height: panelHeight,
renderTo: 'target',
columns: [
{header: 'column1'},
{header: 'column2'}
],
viewConfig:{
forceFit:true
},
store: myStore,
bbar: new Ext.PagingToolbar({
store: myStore,
items:[{
xtype: 'button',
layout: 'fit',
enableToggle:true,
text: '?????',
toggleHandler: showWindow
}]
})
});
});

var win = new Ext.Window({
plain:true,
layout:'fit',
closable:false,
maximizable:true,
});

var showWindow = function(button, state){
if(state){
win.show();
win.maximize();
gridPanel.setSize('auto','auto');
win.add({items : [ gridPanel ]});
win.doLayout(true, true);
}
if(!state){
win.close();
//grid????????
gridPanel.setSize(panelWidth, panelHeight);
gridPanel.render('target');
}
};

</script>
</head>

<body>
<div id="target"></div>
</body>
</html>

mashiki
11 Jun 2010, 5:03 PM
???UI????
target?div???????????????????????????
???????????????????



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.0/resources/css/ext-all.css" />
<script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.0/ext-all.js"> </script>
<script type="text/javascript">
Ext.onReady( function(){
var myStore = [
["value11", "value12"],
["value21", "value22"]
];
var panelWidth = 700, panelHeight = 500;
var gridPanel = new Ext.grid.GridPanel({
columns: [
{header: 'column1'},
{header: 'column2'}
],
viewConfig:{
forceFit:true
},
store: myStore,
bbar: new Ext.PagingToolbar({
store: myStore,
items:[{
xtype: 'button',
layout: 'fit',
enableToggle:true,
text: '?????',
toggleHandler: showWindow
}]
})
});

var target = new Ext.Container({
width: panelWidth,
height: panelHeight,
layout:'fit',
items:[gridPanel],
renderTo:'target'
});

var win = new Ext.Window({
plain:true,
layout:'fit',
closable:false,
maximizable:true,
});

function showWindow(button, state){
if(state){
win.show();
win.maximize();
win.add(gridPanel);
win.doLayout(true, true);
} else {
target.add(gridPanel);
target.doLayout(true, true);
win.hide();
}
};
});

</script>
</head>
<body>
<div id="target"></div>
</body>
</html>

hatsu1119
13 Jun 2010, 10:02 PM
????????????
????????????????????