DHTML Grid, column resize problem.

Suite and Optimus Suite 5
#1

Hi All,

I am a newbie to to DHTML.
I have a Question about DHTML Grid.
my code is

                        mygrid = new dhtmlXGridObject("mygrid_container");
                        mygrid.setImagePath("<c:url value='/images/'/>");
		        var headerName = "";
			var headerWidth = "";
			var colAlign = "";
			var colType = "";
			var row = "";
			var reSize = "";
			<c:if test="${showResult eq 'Y'}">
				<c:choose>
		  			<c:when test="${Errors eq 'N'}">
						<c:forEach items="${ColumnNames}" var="colName">
							<c:if test="${colName ne '' }">
								if(headerName == "")
								{
									headerName = '<c:out value="${colName}"/>';
									headerWidth = '*';
									colAlign = "left";
									colType = "ro";
									reSize = "true";
								}
								else
								{
									headerName = headerName + ',<c:out value="${colName}"/>';
									headerWidth = headerWidth + ',*';
									colAlign = colAlign + ",left";
									colType = colType + ",ro";
									reSize = reSize + ",true";
								}	
							</c:if>
							<c:if test="${colName eq ''}">
								if(headerName == "")
								{
									headerName = 'column';
									headerWidth = '*';
									colAlign = "left";
									colType = "ro";
									reSize = "true";
								}
								else
								{
									headerName = headerName + ',column';
									headerWidth = headerWidth + ',*';
									colAlign = colAlign + ",left";
									colType = colType + ",ro";
									reSize = reSize + ",true";
								}
							</c:if>
						</c:forEach>
						
						mygrid.setHeader(headerName);
						mygrid.setInitWidths(headerWidth);
						mygrid.setColAlign(colAlign);
						mygrid.setColTypes(colType);
						mygrid.setSkin("light");
						mygrid.enableResizing(reSize);
						mygrid.enableAutoHeight(true);
						
						mygrid.init();
var newId = 0;
						var rowArray;
						var rowCntr;
						<c:forEach items="${queryResult}" var="rows">
							row = "";
							rowArray = new Array();
							rowCntr = 0;
							<c:forEach items="${ColumnNames}" var="colName">
								rowArray[rowCntr++] = '<c:out value="${rows[colName]}" />';
							</c:forEach>
							mygrid.addRow(newId,rowArray,null);
							newId++;
						</c:forEach>
		  			</c:when>
		  		</c:choose>
	 		</c:if>

div is

<div id="mygrid_container" style="width:100%"></div>

problem I am facing is that, i don’t have count of exact number of columns to display in results. Because of that I am setting Init Widths of grid as *. but if columns are more then i am not able to display data properly. so when i am trying to change width of column it is not getting re-sized. and column get shifted to original position.

can you please tell me about this problem ?

#2

Columns, which have size as “*”, will adjust their size automatically, so they can’t be resized by user’s actions. If you want to change such behavior? you can use the next code. It will disable auto-size behavior after data loading

grid.load(url,function(){ grid.setSizes(); for (var i=0; i<grid.getColumnsNum(); i++) grid.initCellWidth[i] == grid.cellWidthPX[i]; grid.setSizes(); })