dynamic rows and colums in GridView

cesar posted over 16 years ago

hello, i need to populate a GridView dynamically, i've created the colums already, but i don't know how to fill the rows???

I 've tried with Cells, but i don't find a function to put the label i want to show,

i got the following code:

       tabla=new HtmlGridView();
        HtmlOutputText tit=new HtmlOutputText();
        tit.setValue("Monitoreo a Caja");
        tabla.setHeader(tit);

        com.infragistics.faces.grid.component.Column col1=new com.infragistics.faces.grid.component.Column();
        HtmlOutputText enc1=new HtmlOutputText();
        enc1.setValue("Header 1");
        col1.setHeader(enc1);
        tabla.getColumns().add(col1);

        com.infragistics.faces.grid.component.Column col2=new com.infragistics.faces.grid.component.Column();
        HtmlOutputText enc2=new HtmlOutputText();
        enc2.setValue("Header2");
        col2.setHeader(enc2);
        tabla.getColumns().add(col2);

        HtmlOutputText valor1=new HtmlOutputText();
        valor1.setValue("valor1");
        HtmlOutputText valor2=new HtmlOutputText();
        valor2.setValue("valor2");
        com.infragistics.faces.grid.component.RowItem ren1=new com.infragistics.faces.grid.component.RowItem();

        com.infragistics.faces.grid.component.Cell cel1=new com.infragistics.faces.grid.component.Cell();
        com.infragistics.faces.grid.component.Cell cel2=new com.infragistics.faces.grid.component.Cell();

        HOW DO I PUT THE LABEL????????

        ren1.getCells().add(cel1);
        ren1.getCells().add(cel2);

        tabla.getRows().add(ren1);

thanks.

1579

Bozhidar Dedov posted over 16 years ago in reply to SDT

Hi,

When you call the createColumnWithDropDown() method with the appropriate parameters, i.g.

Column column5 = createColumnWithDropDown(context, "Country", "#{DATA_ROW.country}", null);

then you bind the specified binding (in this case #{DATA_ROW.country} ) to the value property of the DropDown:
private Column createColumnWithDropDown(FacesContext context,...

dropDown.setValueBinding("value", context.getApplication()
.createValueBinding(binding));

...
}
So you don't need to do anything else, the underlying data model is being updated with the selected value from the DropDownList automatically.

Regards!
Cancel
Reply

Verify Answer

Cancel
395

SDT posted over 16 years ago in reply to Bozhidar Dedov

Hi,

Thanks for your reply!! A related question though:

How can I set this dynamic grid as "editable" programatically. The idea is that once these UIInput components(dropdowns) nested within the columns are edited, the underlying data model is also updated automatically.

Basically, its could be like adding the tag <ig:gridEditing /> to the grid from code.

Thanks and Regards!
Cancel
Reply

Verify Answer

Cancel
1579

Bozhidar Dedov posted over 16 years ago in reply to SDT

Hi,

Try with calling that method instead of the createColumn method in initGrid(). It is used the same way like createColumn() and adds an Infragistics DropDownList to the column.
private Column createColumnWithDropDown(FacesContext context,
String header, String binding, String sortByCriteria) {
Column column = new Column();

if (header != null) {UIOutput columnHeader = new UIOutput();
columnHeader.setValue(header);

column.setHeader(columnHeader);

}

BaseSelectItemList dropDown = new HtmlDropDownList();

DataModel dropDownSource = new ListDataModel();dropDownSource.setWrappedData(createSelectionList());
dropDown.setDataSource(dropDownSource);

dropDown.setValueBinding("value", context.getApplication()
.createValueBinding(binding));

column.getChildren().add(dropDown);

// if there is a sortby criteria
if (sortByCriteria != null) {
column.setSortBy(sortByCriteria);

}
return column;
}

private List createSelectionList() {
List result = new ArrayList();
result.add(new SelectItem("United States"));
result.add(new SelectItem("Germany"));
result.add(new SelectItem("United Kingdom"));
result.add(new SelectItem("Japan"));

return result;
}

I hope this will help you!

Regards!
Cancel
Reply

Verify Answer

Cancel
395

SDT posted over 16 years ago in reply to Bozhidar Dedov

Hi,

     Can you provide a more complex create column example that allows dynamically adding an editable column containing dropdown in WebGrid.

The  static jsf code is something like this:
<ig:column resizable="true" style="width:80px nowrap height:8px background-color: #e6e6e6; border-right: 1px solid silver; text-align: left;" ><f:facet name="header">            <h:outputText value="Status" />        </f:facet><h:selectOneMenu value="#{DATA_ROW.status}" styleClass="igGridCellEditDropDown" style="width:80px;height:10px"> <f:selectItems   value="#{webgrid_TestGrid.statusList}"/> </h:selectOneMenu></ig:column>
Cancel
Reply

Verify Answer

Cancel
1579

Bozhidar Dedov posted over 16 years ago in reply to Bozhidar Dedov

Hi!

Here I will post a simplified example that emphasizes on the dynamic column creating.

In JSF:

<ig:gridView id="grid1" dataSource="#{dynGrid.dataSource}" binding="#{dynGrid.grid}">

In Java:

public class DynGridForum {

private GridView grid = null;private List dataSource = null;

public GridView getGrid() {
return grid;
}

public void setGrid(GridView grid) {
this.grid = grid;

// if the grid is empty, it probably means that it hasn't been

// initialized yet

if (grid.getChildren().isEmpty()) {
initGrid();

}

}

public void initGrid() {
FacesContext context = FacesContext.getCurrentInstance();

// clear the grid

clearGrid();

// set the pagesize
grid.setPageSize(10);

Column column1 = createColumn(context, "First Name",
"#{DATA_ROW.firstName}", "firstName");
grid.getTemplateItems().add(column1);

Column column2 = createColumn(context, "Last Name",
"#{DATA_ROW.lastName}", "lastName");
grid.getTemplateItems().add(column2);

Column column3 = createColumn(context, "E-Mail", "#{DATA_ROW.email}",
"email");
grid.getTemplateItems().add(column3);

Column column4 = createColumn(context, "Phone Number",
"#{DATA_ROW.phoneNumber}", "phoneNumber");
grid.getTemplateItems().add(column4);

// ask the grid to rebind itself to its datasource
grid.dataBind();
}

private void clearGrid() {
// clear the grid
grid.setFooter(null);
grid.setHeader(null);
grid.getChildren().clear();
grid.getTemplateItems().clear();
grid.setColumnPositions(null);
}

private Column createColumn(FacesContext context, String header,
String binding, String sortByCriteria) {
Column column = new Column();

if (header != null) {UIOutput columnHeader = new UIOutput();
columnHeader.setValue(header);

column.setHeader(columnHeader);

}

UIOutput columnContent = new UIOutput();
// define the value binding
columnContent.setValueBinding("value", context.getApplication()
.createValueBinding(binding));

column.getChildren().add(columnContent);

// if there is a sortby criteria
if (sortByCriteria != null) {
column.setSortBy(sortByCriteria);

}
return column;
}

public List getDataSource() {
dataSource = new ArrayList();
Person person = new Person("Allene", "Boyle", "A.Boyle@mymail.com",
"555-1234");
dataSource.add(person);
person = new Person("Karin", "Rolfson", "K.Rolfson@mymail.com",
"555-5678");dataSource.add(person);

return dataSource;
}

public void setDataSource(List dataSource) {this.dataSource = dataSource;
}

}
public class Person {

private String firstName = null;
private String lastName = null;
private String email = null;
private String phoneNumber = null;

public Person(String firstName, String lastName, String email,
String phoneNumber) {
this.firstName = firstName;
this.lastName = lastName;
this.email = email;this.phoneNumber = phoneNumber;
}

...

// Getters and Setters
...

}

Regards!
Cancel
Reply

Verify Answer

Cancel