Column or Cell Padding

Suite and Optimus Suite 5
#1

Re: v.2.5 build 91111

Hi,

Given “MyGrid” of type dhtmlXGridObject.

What would be the correct way to add a right pad of say 5 pixels a column of right aligned numbers?

Thanks,
Karl

#2

You can set style for the cells with “style” or “class” attributes of tag in xml:

Cell value
or
Cell value

#3

Olga,

Thank you for your reply. But I"m sorry, I don’t understand. Maybe it’s because I’m using the API? (Please understand, I’m a database programmer just trying to hack together a page!)

Below I copied a very simple HTML page that validates. The grid is populated with 3 rows in a button click event. There are 6 columns. I would like column Col1 to have 3px of left padding and columns labeled Col4, Col5, Col6, to have 3px of right padding.

How do I do that?

Thanks,
Karl

Test Grid - How do I left or right pad the columns with pixels? #Schedule { margin:0; padding:0; border-width:1px; border-color:#000; border-style:ridge; } p { margin:0 10em; }; function initThisGrid() { gSchedule = new dhtmlXGridObject("Schedule"); gSchedule.setImagePath("codebase/imgs/"); gSchedule.setHeader("Col1,Col2,Col3,Col4,Col5,Col6"); gSchedule.setInitWidths("87,115,115,115,115,*"); //ReadOnly (ro) - the cell can't be edited; gSchedule.setColTypes("ro,ro,ro,ro,ro,ro"); // Setting horizontal alignment gSchedule.setColAlign("left,center,right,right,right,right"); // Setting vertical Alignment gSchedule.setColVAlign("middle,middle,middle,middle,middle,middle"); gSchedule.setEditable(false); gSchedule.enableSmartRendering(true); gSchedule.init(); }; 
		function fillGrid() {
			gSchedule.clearAll();
			gSchedule.addRow(1, Array("2010", "01/01/2010", "1,000", "2,000", "3,000.99", "4,000.88"));
			gSchedule.addRow(2, Array("2010", "02/01/2010", "1,000", "3,000", "5,000.99", "14,000.88"));
			gSchedule.addRow(3, Array("2010", "03/01/2010", "1,000", "4,000", "6,000.99", "24,000.88"));
			return true;
		}
	</script>
</head>
<body>
	<div style="margin:10em;">
		<div id="Schedule" style="height: 17.5em;width:40em;"></div>
	</div>
	<p><input type="button" onclick="fillGrid();" value="Populate Grid" /></p>
	<script type="text/javascript">
		initThisGrid();
	</script>
</body>
#4

You can change style of each cell at the necessary column with setCellTextStyle(row_id, ind, styleString) method. Please find more information here docs.dhtmlx.com/doku.php?id=dhtm … ltextstyle

#5

Thank you Olga,

setCellTextStyle allows me to do what I want to do. However, this seems to require a lot of overhead – calling a method to style ever grid’s cell after it is created.

In the future, I think it would be great to have a way to declare a column’s style. May as well create a cell with the “correct” style from the start rather than to restyle it after it is rendered. Just my two cents.

Karl