PDA

View Full Version : card??????compositefield???????????



aoyama
5 Apr 2010, 5:10 AM
?????????
Aoyama???

card??????????????????????????????????????????
????????????????compositefield??????????
html???????????first?forth???????????????
??????????activeItem???????????????
Firebug??x-hide-display???????????????????????

?????????third?????????????compositefield?????????
???????????????????
???????????


=========== ???? ============
<html>
<head>

<meta http-equiv="content-type" content="text/html"; charset="utf-8">
<title>????</title>
<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>
</head>
<body>

<div id="test"></div>
</body>
<script type='text/javascript' type="text/javascript">
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = '../../../extjs/resources/images/default/s.gif';
var jobType = {
xtype : 'combo',
editable : false,
store : new Ext.data.SimpleStore({
fields : ['name'],
data : [
['first'],
['second'],
['third'],
['forth']
]
}),
valueField : 'name',
displayField : 'name',
typeAhead : true,
mode : 'local',
triggerAction : 'all',
value: 'third',
listeners : {
'select': {scope:this, fn:function(combo, rc, idx) {
console.info(rc);
Ext.getCmp('sreen_id').layout.setActiveItem(idx);
}, stopEvent:true}
}
};


var win = new Ext.Panel({
renderTo: 'test',
items:[{
xtype: 'compositefield',
items: [jobType, {
xtype: 'panel',
layout: 'card',
activeItem : 1,
id: 'sreen_id',
items: [{
id: 'card-0',
html: 'TEST0'
},{
id: 'card-1',
height:20,
items:[{
xtype: 'compositefield',
hideLabel: true,
items: [{
xtype: 'label',
text : "NUMBER1",
margins : {top:0, right:0, bottom:0, left:70}
}, {
xtype: 'numberfield',
width: 80
}, {
xtype: 'label',
text : 'NUMBER2'
}, {
xtype: 'numberfield',
width: 80
}, {
xtype: 'label',
text : "LAST"
}]
}]
},{
id: 'card-2',
height:20,
items:[{
xtype: 'compositefield',
hideLabel: true,
items: [{
xtype: 'label',
text : "NUMBER3",
margins : {top:0, right:0, bottom:0, left:70}
}, {
xtype: 'numberfield',
width: 80
}, {
xtype: 'label',
text : "LAST"
}]
}]
},{
id: 'card-3',
html: 'TEST3'
}]
}]
}]
});
});
</script>

</html>

Tommy1969
6 Apr 2010, 6:12 AM
????? width: 500 ???????????????????????? :)



id: 'card-2',
height: 20,
items: [{
xtype: 'compositefield',
hideLabel: true,
width: 500,
items: [{
xtype: 'label',
text: "NUMBER3",
margins: {
top: 0,
right: 0,
bottom: 0,
left: 70
}},{
xtype: 'numberfield',
width: 80
},{
xtype: 'label',
text: "LAST"
}]
}]


layout ??????????????????????????????????????????????????

aoyama
6 Apr 2010, 8:55 PM
Tommy??

???????????????
???????????????:)

active??layout??or ?????????????????:-/