PDA

View Full Version : combox render problem in toolbar,Pls help me!!!!



dgms
21 Jul 2008, 3:18 AM
I add a combo into toolbar as the code below shows.
When I set the page charset to "iso-8859-1",everything is ok.
however when charset set to "GBK",something goes wrong.
When the combox renders,the input box and arrow button are not
on the same line. And I'm really confused on this problem.

Pls help me. 3x in advance

test it IN IE6

pics in the attachment show the difference.



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<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="xml-grid.js"></script>
</head>
<body>
<div id="example-grid"></div>
</body>
</html>




/*
* Ext JS Library 2.1
* Copyright(c) 2006-2008, Ext JS, LLC.
* [email protected]
*
* http://extjs.com/license
*/

Ext.onReady(function(){

// create the Data Store
var store = new Ext.data.Store({
// load using HTTP
url: 'sheldon.xml',

// the return will be XML, so lets set up a reader
reader: new Ext.data.XmlReader({
// records will have an "Item" tag
record: 'Item',
id: 'ASIN',
totalRecords: '@total'
}, [
// set up the fields mapping into the xml doc
// The first needs mapping, the others are very basic
{name: 'Author', mapping: 'ItemAttributes > Author'},
'Title', 'Manufacturer', 'ProductGroup'
])
});

// create the grid
var grid = new Ext.grid.GridPanel({
title:'test',
frame:true,
store: store,
tbar:[{
name: 'test',
xtype:'combo',
store:[[1,'test']]
}],
columns: [
{header: "Author", width: 120, dataIndex: 'Author', sortable: true},
{header: "Title", width: 180, dataIndex: 'Title', sortable: true},
{header: "Manufacturer", width: 115, dataIndex: 'Manufacturer', sortable: true},
{header: "Product Group", width: 100, dataIndex: 'ProductGroup', sortable: true}
],
renderTo:'example-grid',
width:540,
height:200
});
});

dgms
21 Jul 2008, 5:09 AM
really puzzles me for a couple of days.Any advice appreciated.

dgms
21 Jul 2008, 6:00 AM
i've solved it by changing css. But this method is ugly.



.x-small-editor .x-form-field-wrap .x-form-trigger {
margin-top:-1px;
}
.x-toolbar div{
margin-top:1px;
margin-bottom:-1px;
}