Ext GridPanel横向滚动条不显示，急

[baihui212]

初学Ext，现在在做的一个项目，要求将数据库表中50多个字段在一个GridPanel中显示，数据库数据查询出来了，但没有显示横向滚动条，使得只能查看部分字段，且Column中指定的width也无用。
我再将这个GridPanel放在一个ViewPort中指定ViewPort的autoScroll:true和width，奇怪的是ViewPort显示了上下滚动条不显示横向.
想问下大家如何让这个GridPanel显示横向滚动条？

部分代码：

var grid_person = new Ext.grid.GridPanel({
       store:store,   // store与sm在前面均已定义
       sm: sm,      
       title:"查看I表_t_person", 
       //autoHeight:true,    // 尝试了很多方法，都不显示横向滚动条      
       //autoWidth:true,
	   //width:800,
	   //height: 500,
	   //width: Ext.get("div-grid").getWidth(), 
      // height: Ext.get("div-grid").getHeight(), 
	   autoScroll:true,
	   //layout:'fit',
	   containerScroll : true,
       cm: new Ext.grid.ColumnModel
	   ([ 
	      //new Ext.grid.RowNumberer(),
	      sm,
          {header:"id",dataIndex:"id",sortable:true,width:10},
		  //{header:"pid",dataIndex:"pid",sortable:true,width:10},
		  {header:"code",dataIndex:"code",sortable:true,width:30},
		  {header:"ucode",dataIndex:"ucode",sortable:true,width:30},
		  {header:"pcode",dataIndex:"pcode",sortable:true,width:30},
		  {header:"英文姓",dataIndex:"last_name",width:13,tooltip:"last name",sortable:true,width:10},
		  {header:"英文名",dataIndex:"first_name",tooltip:"first name",sortable:true,width:10},		  
		  {header:"国籍",dataIndex:"nationality",tooltip:"国籍/nationnality",sortable:true,width:10},
		  {header:"性别",dataIndex:"sex",tooltip:"sex",sortable:true,width:10,
				renderer: function(v){
				if(v == "0"){
					return "<img src='../files/images/icons/man.gif'>";
				}else{
					return "<img src='../files/images/icons/woman.gif'>";
				}
			}
		  },
		  {header:"出生日期",dataIndex:"birth",tooltip:"出生日期",sortable:true,width:10},
		  
		  {header:"出生地",dataIndex:"birth_place",tooltip:"出生地",sortable:true,width:10},
		  {header:"身高",dataIndex:"height",tooltip:"身高",sortable:true,width:10},
		  {header:"体重",dataIndex:"weight",tooltip:"体重",sortable:true,width:10},
		  {header:"居住住址",dataIndex:"address",tooltip:"居住地址",sortable:true,width:10},
                   /*.....
                     ....这里省略其他的Column，约30多条*/
                  ]),

                   viewConfig: 
	         {
		  //width:500,
		  //autoScroll:true,
                  forceFit:true,
		  scrollOffset:2 // Grid按钮将不会显示上下滚动条
                  },
               
              tbar[],   // 省略，删除查询等
              bbar[],   //省略，分页

              var viewport = new Ext.Viewport({  
                   layout:'fit',//设置 viewport里面的item在viewport中的布局方式  
                   //animate:true,
		   //width: Ext.get("div-grid").getWidth(), 
                   //height: Ext.get("div-grid").getHeight(),
	          width:600,
		 autoScroll:true,
                 items:[grid_person]  
 });  

[baihui212]

补充一下，在IE和FF中均没有显示，图片右边是有上下滚动条的，没有显示完整。

[baihui212]

问题已解决。

[lin364653705]

forceFit:true,去掉就OK了吧

[zoujp_xyz]

去掉 forceFit:true

[baihui212]

能不能不指定column的width属性让列宽根据查询到的值自动适应宽度的？

[fxcan]

怎么搞定的？？？？？

[baihui212]

[Quote=引用 6 楼 fxcan 的回复:]

怎么搞定的？？？？？
[/Quote]
设置了forceFit:true，这个是多余的，默认就是false

[baihui212]

[Quote=引用 8 楼 ibm_hoojo 的回复:]

引用 5 楼 baihui212 的回复:
能不能不指定column的width属性让列宽根据查询到的值自动适应宽度的？

with: auto;
[/Quote]
width:auto，Firebug报错：“auto未定义”，这样是不行的吧

[hoojo]

好像要引起来的，width: "auto"

[hoojo]

autoWidth: true 和 width: 'auto'相同的效果
autoHeight: true也一样

[lin364653705]

http://www.cnitblog.com/yemoo/archive/2008/05/30/44593.html
去看下这文章吧，自适应宽高。。。

[hoojo]

[Quote=引用 5 楼 baihui212 的回复:]
能不能不指定column的width属性让列宽根据查询到的值自动适应宽度的？
[/Quote]
with: auto;

[liutieniu87]

怎么搞定的，麻烦楼主发出来