PDA

View Full Version : EXT GRID HORIZONTAL SCROLL DO NOT APPEAR



jitesh
15 May 2010, 1:42 AM
Hello Friends,

I have many fields in ext grid. but, horizontal grid do not appear so i can not view all fields of grid.

I have kept width as 'auto'.

Can any one please help me with this?

Thanks in advance.

Jitesh

16 May 2010, 8:09 AM
Can't do too much without seeing code.

jitesh
16 May 2010, 8:07 PM
Please find following code.


GRID
-----


gridTCStep = createExtObject(_EXTEDITGRIDPANEL,{
id: 'tcSteps',
stateId: 'TCSDetail',
ds: dsTCS,
cm: cm,
//autoHeight : true,
height:viewGridHeight-150,
//width : winW-330,
width: 'auto',
// autoExpandColumn: '5',
autoScroll:true,
renderTo: Ext.get('tcSteps').dom,
stripeRows: true,
buttonAlign:'center',
iconCls:'icon-grid',
plugins: [new Ext.ux.dd.GridDragDropRowOrder(
{
copy: false, // false by default
scrollable: true, // enable scrolling support (default is false)
targetCfg: '' // any properties to apply to the actual DropTarget
})],
// inline toolbars
clicksToEdit:1,
tbar: [{
text: 'Add Step',
tooltip:'Add a new step',
iconCls:'add',
icon: iconPath + 'add.png',
handler : function(){
if(!viewDisabled)
{
try{
if (MaxNo){
MaxNo += 1;
}
}catch(e){
//finding max number of steps
//alert(dsTCS.totalLength);
if (dsTCS.totalLength == undefined || dsTCS.totalLength == 0)
{
dsTCS.totalLength = 0;
MaxNo = 0;
}else{
MaxNo = Number(dsTCS.data.items[0].data.MaxStepNo);
}
MaxNo += 1;
}
//console.log(MaxNo);
if(!totalPageRecordCount){
totalPageRecordCount = dsTCS.data.items.length;
totalRecordCount = dsTCS.totalLength+1;
if (dsTCS.data.items.length == 0){
totalPageRecordCount = 0;
}
}else{
totalPageRecordCount += 1;
totalRecordCount += 1 ;
}

//console.log(totalPageRecordCount);
//console.log(totalRecordCount);
if (dsTCS.data.items.length == 0 && totalPageRecordCount == 0){
insertAt = totalPageRecordCount;
}else{
insertAt = totalPageRecordCount;
}
// Requirement Id Q137 - 3.7 Sprint 1 Hitesh Parmar
var cnt;
var newStepLimit=5;var min=newStepLimit+dsTCS.data.items.length;
insertAt=dsTCS.data.items.length;
for(cnt=1;cnt<=newStepLimit;cnt=cnt+1)
{
var p = new Plant({
StepName:'',
StepNumber: String(min),
StepDescription: '',
InputData: '',//(new Date()).clearTime(),
ExpectedOutcome: '',//false
UserDefined01: '',
UserDefined02: '',
UserDefined03: '',
UserDefined04: '',
UserDefined05: '',
newRecord: true
});
gridTCStep.stopEditing();
dsTCS.insert(insertAt, p);
gridTCStep.startEditing(insertAt, 3);
min--;
//console.log(Number(ds.totalLength) + 1);
}
}
}
}, '-' ,{
text: 'Remove Step',
tooltip:'Remove the selected step',
iconCls:'remove',
icon: iconPath + 'delete.png',
handler : function(){
if(!viewDisabled)
{
if(gridTCStep.getSelectionModel().getSelections().length > 0){
Ext.MessageBox.confirm('Confirm', 'Are you sure you want to delete the selected TestCase Step? You need to save TestCase in order to get effect of delete operation.',deleteStep);
}
else{
Ext.MessageBox.alert('ERROR', 'Please select a TestCase Step to delete.', '');
}
}
}
}],
sm: sm2 // Requirement Id Q170 - 3.7 Sprint 1 Hitesh Parmar
});



Panel
-----


winW2 = winW - 300 ;
var tcpanel = new Ext.Panel({
renderTo:Ext.get('firstDiv').dom,
bodyBorder: false,
/*width:'auto',*/
width:winW-292,
height:winH - 167,
layout:"fit",
items:[{
layout:"border",
bodyBorder: false,
items:[{
region:"center",
heigth:'auto',
autoScroll:true,
width:'auto',
bodyBorder: false,
items:[{
xtype:"panel",
collapsible:true,
bodyBorder: false,
hidden:<?=$showErrorMsg?>,
width: 'auto',
html:"<?=$txtMsgError?>"
},{
xtype:"panel",
collapsible:true,
autoHeight:true,
hidden:<?=$showErrorMsg?>,
bodyBorder: false,
width: 'auto',
html:"<?=$txtMsgSuccess?>"
},{
xtype:"panel",
title:"<?=$VerText?>",
animCollapse:true,
animate:true,
autoScroll:true,
collapsible:true,
bodyBorder: false,
autosize:true,
width: 'auto',
//renderTo:'mainTCD',
html:'<?=$mainTCD?>',
tools: [{id:'blank'}]
},{
xtype:"panel",
title:"User Defined Fields",
animCollapse:true,
animate:true,
autoScroll:true,
collapsible:true,
bodyBorder: false,
autosize:true,
width: 'auto',
//renderTo:'tcUDF',
//collapsed:true,
html:'<?php echo str_replace("<li></li>","",str_replace("'",'"',str_replace("\r","",str_replace("\n","",$tcUDF))))?>',
tools: [{id:'blank'}]
},{
xtype:"panel",
title:"Attributes",
animCollapse:true,
animate:true,
autoScroll:true,
collapsible:true,
//collapsed:false,
bodyBorder: false,
autosize:true,
width: 'auto',
//renderTo:'tcFields',
html:'<?=$tcFields?>',
tools: [{id:'blank'}]
},{
xtype:"panel",
title:"TestCase Steps",
el:"tcSteps",
animCollapse:true,
animate:true,
//autoScroll:true,
//collapsed:true,
bodyBorder: false,
collapsible:true,
//autosize:true,
//width: 'auto',
//html:'<?=$tcSteps?>',
tools: [{id:'blank'}]
}]
},{
region:"south",
bodyBorder: false,
animCollapse:true,
height: 40,
animate:true,
html:'<?=$tcButtons?>'
}]
}]
});




Thanks.

17 May 2010, 6:21 PM
I am not seeing where you are including the grid.

jitesh
17 May 2010, 11:55 PM
renderTo: Ext.get('tcSteps').dom

renders grid to a div tag with id 'tcSteps'.