Hii everyone
I need to have my gird's first row selected by default on load. is there any attribute to do this.
ig:columnSelectRow is not useful for me because it has a check box and also it will not select a row by default. when i tried to take the view soruce(HTML) of the page i didn't found any code related to ig:column. As i am new to this i dont have much knowledge. please help me
Hello Vijayada,
Using the ig:columnSelectRow, it may not possible to select only one row on pageload. The thing which you can do is to use h:selectBooleanCheckbox in the first column and bind its value attribute in your bean methd returning boolen.
If you want to make first row selected then you just need to set the "true" in your backing bean for the fild returning the boolean.
Following is the code snippets for your reference:
<ig:gridView binding="#{bean.grid}" dataSource="#{bean.gridData}" pageSize="5"> <ig:column resizable="true"> <h:selectBooleanCheckbox value="#{DATA_ROW.selected}"> </h:selectBooleanCheckbox>
<f:facet name="header"> <h:outputText value="Select"></h:outputText> </f:facet>
</ig:column>..</ig:gridView>
Note: Here " value="#{DATA_ROW.selected}" is the key part to make the check box selected for the row (selected is the ). Just use boolean value according to your need to make row selected.
Roshan
You can refer the following smaple to get better implementation use of this.
http://www.componentsforjsf.com/WebGridExamples/faces/examplePages/RowSelectionWithPersistence.jsp
Thanks roshan
we can select the row by this method. but the rows are not seems like selected. that is there is no color change in the row. i want the grid to be displayed as first row selected by changing the backgroud color of row
I would write a little javascript to a style to the first row of the grid when the page loads. I guess you'll have to assign it to each CELL in the row, but that'll do the trick.
Best,Jim
But how should i get id of the row. when i take the view source of the page. there is only some calls to javascript functions. only the header part of the grid is rendered into html format. ig:column is not seen as rendered in the view source.
The ID is in there and if you dig a little you'll find it.
As an example, suppose I set up a grid like this:
<h:form id="myTestPage"> <ig:gridView id="myGrid" dataSource="#{simpleGrid.gridData}" styleClass="gridView" pageSize="5"> <ig:column id="myColumn1"> <h:outputText id="myColumn1Field" value="#{DATA_ROW.lastName}"></h:outputText> <f:facet name="header"> <h:outputText value="Last Name" /> </f:facet> </ig:column> </ig:gridView> </h:form>
Notice that I've set an ID on the outputText field inside my column.
When I run this and view source, I'll see the following (I searched on "Smith" to find it BTW):
<td class="igGridColumn" otype="GridCell"><span id="myTestPage:myGrid:myColumn1Field_0">Smith</span></td>as you can see, the ID I need is myTestPage:myGrid:myColumn1Field_0If you want to style the td that contains this ID (you'll need to to set tha background color properly), use the parentNode attribute. This will look something like:var x = document.getElementById("myTestPage:myGrid:myColumn1Field_0");var y=x.parentNode;y.style.backgroundColor="green";Best,Jim
Vijayada, Roshan:
Thanks guys! Its really nice to get feedback when my suggestions are helpful. :)
Also, the input we get from users on the forums helps us understand what our customers need, so keep those questions coming!
Hello Jim,
You definitely guide us with a great solution...
Thank you.
Thanks jim
that really helps..