Trying to map a DataSourceField using TypeAsDataSource to ListGrid

[crismeck]

SmartGWT 2.4
FF 3.6.15

I have a datasource with a field whose type is defined as a different source through the DataSourceField.setTypeAsDataSource. I subsequently mapped this datasource to a listgrid and the subtyped datasource field won't show a displayable value. I have a combo box editor set on my datasource field and have mapped the display and value fields. Doing this causes the right values to show in the dropdown inside the listgrid, but the actual cell shows [Object object]. The developer's console doesn't show anything that seems to be in error (I turned the xmlselect and xmlbinding log levels up to debug as well). I can't seem to find in the documentation how to make this field show something sensible, or I'm missing something fundamental about how to create a datasource to handle a composite objects. I've attached the graphic of what my listgrid looks like from the code I'm adding here.

My test:

public class DataTypeListGrid implements EntryPoint {
	class MySubDataSource extends RestDataSource {
		public MySubDataSource() {
			setDataFormat(DSDataFormat.JSON);
			setDataURL("/DataTypeListGrid/ds/test/mysubds.data.json");
			DataSourceIntegerField id = new DataSourceIntegerField("id");
			id.setPrimaryKey(true);
			DataSourceTextField name = new DataSourceTextField("name");
			DataSourceTextField description = new DataSourceTextField("description");
			setFields(id,name,description);
		}
	}
	class MyDataSource extends RestDataSource {
		public MyDataSource() {
			setDataFormat(DSDataFormat.JSON);
			setDataURL("/DataTypeListGrid/ds/test/myds.data.json");
			DataSourceIntegerField id = new DataSourceIntegerField("id");
			id.setPrimaryKey(true);
	
			ComboBoxItem picker = new ComboBoxItem("subtype");
			picker.setOptionDataSource(new MySubDataSource());
			picker.setDisplayField("name");
			picker.setValueField("id");
			DataSourceField subtype = new DataSourceField();
			subtype.setName("subtype");
			subtype.setTypeAsDataSource(new MySubDataSource());
			subtype.setEditorType(picker);
			subtype.setCanEdit(true);
			
			DataSourceTextField field1 = new DataSourceTextField("field1");
			field1.setCanEdit(true);
			
			setFields(id,subtype,field1);
		}
	}
	
	
	public void onModuleLoad() {

		final MyDataSource ds = new MyDataSource();
		ListGrid grid = new ListGrid();
		grid.setDataSource(ds);
		grid.setCanEdit(true);
		grid.setAutoFetchData(true);
		grid.setSize("100%", "100%");
		grid.draw();
	}
}

My mock data:
mysubds.data.json

{"response":{"status":0,"startRow":0,"endRow":1,"totalRows":2,
"data":[{"id":1,"name":"bart","description":"dont have a cow"},
{"id":2,"name":"homer","description":"doh"}
]}}

{"response":{"status":0,"startRow":0,"endRow":1,"totalRows":2,
"data":[{"id":1,"subtype":{"id":1,"name":"bart","description":"dont have a cow"},  "field1":"myfield1"}, 
{"id":2,"subtype"{"id":2,"name":"homer","description":"doh"},"field1":"blah"}]}}

[Isomorphic]

You can add a CellFormatter to display what you'd like, however, what's more common is to store the ID of a related record (see optionDataSource). This is more normalized and allows independent load and save of the entities, as well as load on demand.