I have ultrawebgrid(FieldGrid) with three columns(Container,Product,Qty)
on Tabout from lastcell(Qty) of first row
1) it should create new row below
2) with focus pointing at first cell of newly added row
I tried using JavaScript keydownhandler.
1) I am able to add new row,
2) but as soon as the row is added focus is lost and page is refreshed
3) once again I have to click on newly added row first cell to activate it
thanks for the post.. it helped me when there is no group by selection
// Column Size Arrayvar colArray;function InitWidth(gridName) { // Retrieve the grid based on its ID. var oGrid = igtbl_getGridById(gridName);
// Get the Bands collection var oBands = oGrid.Bands;
// Get the columns collection for Band 0 var oBand = oBands[0]; var oColumns = oBand.Columns;
// The column count is equal to the // length of the Columns array. var count = oColumns.length;
// Initialise Column Size Array on the first call. if (colArray == null) { colArray = new Array(); for (var i = 0; i < count; i++) { colArray[i] = 0; } }
// Set each Column Header width. var oColHeaders; for (var i = 0; i < count; i++) { // Don't check columns that aren't displayed if (!oColumns[i].ServerOnly && !oColumns[i].Hidden) { // This loop is needed since each Column Header // have the same Id in every group. We need to // check them all because only opened groups will // have a value in "offsetWidth". oColHeaders = oGrid.MainGrid.getElementsByTagName('th'); for (var j = 0; j < oColHeaders.length; j++) { if (oColHeaders[j].getAttribute('id') == oColumns[i].Id) { var colWidth = oColHeaders[j].firstChild.offsetWidth; if (colArray[i] < colWidth) { colArray[i] = colWidth; } if (colWidth > 0) { // We found a displayed header, no need to check them all. break; } } } } }
// Get the width from the data rows ParseNonGroupingRows(oGrid.Rows, oColumns, colArray);
//if grid widths > colArray's count ChangeColumnsWidthToFix(oColumns,oGrid.MainGrid.clientWidth-50,colArray); /* var colWidthCount=0; var enableColumns=0; var avgWidth=5; var maxWidth=200; for (var i = 0; i < count; i++) { // Don't check columns that aren't displayed if (!oColumns[i].ServerOnly && !oColumns[i].Hidden) { colWidthCount+=colArray[i];enableColumns++; } } if(colWidthCount<oGrid.MainGrid.clientWidth) { avgWidth=Math.round((oGrid.MainGrid.clientWidth- colWidthCount)/enableColumns); } // Loop through each Column in the grid to set // the Column width to the largest width found. for (var i = 0; i < count; i++) { // Don't set the width for columns that weren't available if (colArray[i] > 0) { // Note: the 10 pixels padding here might need to be // adjusted depending on the layout and styles of the grid. oColumns[i].((colWidthArry[i]+avgWidth)>maxWidth?maxWidth:(colWidthArry[i]+avgWidth)); } } }*/
}
function ChangeColumnsWidthToFix(colList,gridWidth,colWidthArry){ //debugger; var enableColumns=0; var avgWidth=5; var maxWidth=200; var colWidthCount=0; var gerColWidthCount=0; var lstWidth=""; for (var i = 0; i < colList.length; i++) { // Don't check columns that aren't displayed if (!colList[i].ServerOnly && !colList[i].Hidden) { enableColumns++; colWidthCount+=colArray[i]; if(colArray[i]>maxWidth) lstWidth+=(lstWidth==""?i:","+i); else gerColWidthCount+=colArray[i]; } } if(colWidthCount<gridWidth) { avgWidth=Math.round((gridWidth- colWidthCount)/enableColumns); } else { if(lstWidth!="") { var strA=lstWidth.split(','); var w=gridWidth-gerColWidthCount; if(w<0 || (colWidthCount-gerColWidthCount-strA.length*maxWidth)<0) { for(var e=0;e<strA.length;e++) colWidthArry[parseInt(strA[e])]=maxWidth; } else { var nw=Math.round(w/strA.length); for(var e=0;e<strA.length;e++) colWidthArry[parseInt(strA[e])]=nw; } } } // Loop through each Column in the grid to set // the Column width to the largest width found. for (var i = 0; i < colList.length; i++) { // Don't set the width for columns that weren't available if (colWidthArry[i] > 0) { // Note: the 10 pixels padding here might need to be // adjusted depending on the layout and styles of the grid. colList[i].setWidth(colWidthArry[i]+avgWidth); } } }
// This function go through each level of grouping rows // in order to get to the data rowsfunction ParseNonGroupingRows(rowList, colList, colWidthArray) { if (rowList.getRow(0).GroupByRow) { // Check if the first row is a GroupBy row for (var i = 0; i < rowList.length; i++) { // If so, call the function recursively for each // GroupBy row in the list, passing out it's // (child) Rows collection to the function. ParseNonGroupingRows(rowList.getRow(i).Rows, colList, colWidthArray); } } else { // The first row is a data row, parse all the rows // in the collection to get their cells width. GetRowsCellWidth(rowList, colList, colWidthArray); }}
// This function do the actual job of getting the columns // width from each cellfunction GetRowsCellWidth(rowList, colList, colWidthArray) { for (var i = 0; i < rowList.length; i++) { for (var n = 0; n < colList.length; n++) { // Don't check columns that aren't displayed if (!colList[n].ServerOnly && !colList[n].Hidden) { var cell = rowList.getRow(i).getCell(n); if (colWidthArray[n] < cell.Element.firstChild.offsetWidth) { colWidthArray[n] = cell.Element.firstChild.offsetWidth; } } } }}
// Call the function in the grid's eventsfunction InitializeLayout(gridName){ InitWidth(gridName);}
function AfterRowExpanded(gridName){ InitWidth(gridName);}
//if grid widths > colArray's count , var colWidthCount=0; var enableColumns=0; var avgWidth=5; for (var i = 0; i < count; i++) { // Don't check columns that aren't displayed if (!oColumns[i].ServerOnly && !oColumns[i].Hidden) { colWidthCount+=colArray[i];enableColumns++; } } if(colWidthCount<oGrid.MainGrid.clientWidth) { avgWidth=Math.round((oGrid.MainGrid.clientWidth- colWidthCount)/enableColumns); } // Loop through each Column in the grid to set // the Column width to the largest width found. for (var i = 0; i < count; i++) { // Don't set the width for columns that weren't available if (colArray[i] > 0) { // Note: the 10 pixels padding here might need to be // adjusted depending on the layout and styles of the grid. oColumns[i].setWidth((colArray[i] + avgWidth)); } }}
Instead of looping through all the cells in a column just use the PerformAutoResize on the specific column