[OPEN] ComboBox doesn't shown properly

[rgpinheiro]

here we go again...:)

while trying to set the display field with an attribute that belongs to an object of my ModelData ComboBox, the data are not shown correctly

here the code:


import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.widget.Dialog;
import com.extjs.gxt.ui.client.widget.form.ComboBox;
import com.extjs.gxt.ui.client.widget.form.FormPanel;
import com.google.gwt.core.client.EntryPoint;

public class Index implements EntryPoint {

private ComboBox<Person> comboBox;
private Person person1;
private FormPanel formPanel;
private Dialog dialog;
private Person person2;
private Address address1;
private Address address2;

public void onModuleLoad() {

Long i = new Long(3);

person1 = new Person();
person1.setId(1);
person1.setName("Rafael");
person1.setPersonCode(i);

address1 = new Address();
address1.setId(332);
address1.setStreetName("First Heaven");
address1.setStreetNumber(i+10);

person1.setAddress(address1);
//======================

person2 = new Person();
person2.setId(2);
person2.setName("Offspring");
person2.setPersonCode(i+1);

address2 = new Address();
address2.setId(32);
address2.setStreetName("Times Square");
address2.setStreetNumber(i+20);

person2.setAddress(address2);
//======================

ListStore<Person> listPerson = new ListStore<Person>();
listPerson.add(person1);
listPerson.add(person2);

dialog = new Dialog();
dialog.setWidth(400);
dialog.setHeight(200);

formPanel = new FormPanel();
formPanel.setHeaderVisible(false);
formPanel.setFrame(true);
formPanel.setFieldWidth(110);
formPanel.setLabelWidth(100);
formPanel.setButtonAlign(HorizontalAlignment.CENTER);
formPanel.setWidth("100%");

comboBox = new ComboBox<Person>();
comboBox.setStore(listPerson);
comboBox.setDisplayField("address.streetName");

comboBox.setFieldLabel("Person cod:");

formPanel.add(comboBox);
dialog.add(formPanel);

dialog.show();
}

}


import com.extjs.gxt.ui.client.data.BaseTreeModel;

public class Person extends BaseTreeModel {

private static final long serialVersionUID = -7506205164127602576L;

private int id;
private String name;
private Long personCode;
private Address personAddress;

public Person(){

}

public int getId() {
return get("id");
}

public void setId(int id) {
set("id", id);
}

public String getName() {
return get("name");
}

public void setName(String name) {
set("name", name);
}

public Long getPersonCode() {
return get("personCode");
}

public void setPersonCode(Long personCode) {
set("personCode", personCode);
}

public Address getAddress() {
return get("personAddress");
}

public void setAddress(Address personAddress) {
set("personAddress", personAddress);
}

}


import com.extjs.gxt.ui.client.data.BaseTreeModel;

public class Address extends BaseTreeModel {

private static final long serialVersionUID = 1387724684937498499L;

private int id;
private String streetName;
private Long streetNumber;

public int getId() {
return id;
}

public void setId(int id) {
this.id = id;
}

public String getStreetName() {
return streetName;
}

public void setStreetName(String streetName) {
this.streetName = streetName;
}

public Long getStreetNumber() {
return streetNumber;
}

public void setStreetNumber(Long streetNumber) {
this.streetNumber = streetNumber;
}

}
http://img213.imageshack.us/img213/6459/screenshotuj6.th.png (http://img213.imageshack.us/my.php?image=screenshotuj6.png)

[darrellmeyer]

First, please post your sample code as a single class (http://extjs.com/forum/showthread.php?t=40289). Second, you have 2 bugs in your code.

1. You are setting the address as "personAddress" not "address".
2. You Address pojo is not using get and set internally which is required.

[rgpinheiro]

We've make the changes you tell, but doesn't work...

I'll post again the simple class code:



import java.io.Serializable;
import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
import com.extjs.gxt.ui.client.data.BaseTreeModel;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.widget.Dialog;
import com.extjs.gxt.ui.client.widget.form.ComboBox;
import com.extjs.gxt.ui.client.widget.form.FormPanel;
import com.google.gwt.core.client.EntryPoint;

public class Index implements EntryPoint {

private ComboBox<A> comboBox;
private FormPanel formPanel;
private Dialog dialog;

public void onModuleLoad() {
A a = new A();
B b = new B();
b.setC("test");
a.setB(b);

ListStore<A> listPerson = new ListStore<A>();
listPerson.add(a);

dialog = new Dialog();
dialog.setWidth(400);
dialog.setHeight(200);

formPanel = new FormPanel();
formPanel.setHeaderVisible(false);
formPanel.setFrame(true);
formPanel.setFieldWidth(110);
formPanel.setLabelWidth(100);
formPanel.setButtonAlign(HorizontalAlignment.CENTER);
formPanel.setWidth("100%");

comboBox = new ComboBox<A>();
comboBox.setStore(listPerson);
comboBox.setDisplayField("b.c");

comboBox.setFieldLabel("Attribute C of Class B that belong to class A");

formPanel.add(comboBox);
dialog.add(formPanel);

dialog.show();
}

private class A extends BaseTreeModel implements Serializable {
public void setB(B b) {
set("b", b);
}

public B getB(){
return get("b");
}
}

private class B extends BaseTreeModel implements Serializable {
public void setC(String c) {
set("c", c);
}

public String getC(){
return get("c");
}
}
}

[rgpinheiro]

- GXT 1.0. RC2
- hosted GWT browser
- Ubuntu 8.04

[rgpinheiro]

somebody knows what I can do?

[darrellmeyer]

The Template class does not support nested objects. Combo uses the Template class, so you will have to "flatten" your data for use in Combo. I am marking this post as open to be addressed at a later time.

[rgpinheiro]

Ok... I'll wait

Thanks

[fother]

any suggest to solve this problem?

[sdc]

Yes. See http://extjs.com/forum/showthread.php?p=291380#post291380