Problem with ListGrid expansion mode form

[jay.l.fisher]

I'm trying to create something much like the nested form sample and I'm having the same problem with the sample.

If you expand a row, type something into one of the fields in the expansion form, then collapse the row and expand it again the text you typed is gone.

I also see a problem in the sample where, once you make a change in the expansion form the row will no longer collapse. It doesn't happen with every change, but it does with most.

[Isomorphic]

This is basically an example-specific bug - it's just creating a new expansion component each time but should probably be associating them with records instead, so the same one (in the same state) can be used if the record is re-opened.

On the second behavior (inability to collapse), the Showcase is currently running on an old nightly that had a few known bugs. Are you able to cause a similar problem with the latest nightly?

[jay.l.fisher]

SmartClient Version: SC_SNAPSHOT-2010-12-04/EVAL Deployment

I'm running into the first problem (values disappearing after collapse/expand) and I'm just using the default behavior of ListGrid.setCanExpandRecords(true) and ListGrid.setExpansionMode(ExpansionMode.EDITOR). Is there anything else I need to do?

[Isomorphic]

Ah, we thought you were looking at the sample.

True, the built-in behavior probably should warn about lost edits before collapsing - we'll look at adding that. In the meantime, the built-in behavior is trivial to replicate by binding a form to the grid's current DataSource, so you could take that approach and add your own warning on RecordCollapse.

[jay.l.fisher]

Can't see much use for the ExpansionMode.EDITOR in it's current implementation. Even if I don't collapse the row, and if I have autoSaveEdits(true) the ListGridRecord does not contain the edited value for field in the expansion form. Even using getEditedRecord().

Getting the default behavior of including only the non-visible fields in the expansion editor isn't exactly trivial, but I'll take that approach and see where I get. I was hoping the default behavior would be useful. It sounded like exactly what I needed.

btw - I am still seeing the inability to collapse behavior in the 12/4 nightly.

[jay.l.fisher]

Can't seem to get this to work. I've added the following RecordCollapseHandler in the hopes of being able to auto-save the edited fields when the user collapses the row. In this case it is a client-only grid and the entire grid is saved when they click a Save button, so having another Save button in the expansion form like the sample would be confusing. Here is what I'm doing in the collapse handler, but after collapsing and then expanding the values are gone.

grid.addRecordCollapseHandler(new RecordCollapseHandler() {				
	@Override
	public void onRecordCollapse(RecordCollapseEvent event) {
		grid.endEditing();
		grid.saveAllEdits();
	}
});

And here is the expansion component code.

grid = new ListGrid()  {
    @Override
    protected Canvas getExpansionComponent(final ListGridRecord record) {

        final ListGrid myGrid = this;

        final DynamicForm df = new DynamicForm();
        df.setNumCols(4);
        df.setFields(
        		new TextAreaItem("notes"), 
        		new StaticTextItem("originalNotes"));
        df.setDataSource(myGrid.getDataSource());
        df.addDrawHandler(new DrawHandler() {
            public void onDraw(DrawEvent event) {
                df.editRecord(record);
            }
        });

        return df;
    }
};

[Isomorphic]

The expansion components are not wired into the inline editing system by default (this is a good feature idea, but it's not there now).

The way to handle this for an autoSaveEdits:false grid would be to take the values in the form and apply them as editValues when the form is collapsed. Then, when re-expanded, populate the form via editRecord() as you're doing, but use the result of getEditedRecord() instead (to pick up editValues that may apply to the form).

[jay.l.fisher]

Not sure I follow. In this case I'm using autoSaveEdits:true.

But in the RecordCollapseHandler, how do I get access to the form to save the values from it.

[Isomorphic]

You mentioned something about saving only when an explicit save button is pressed, which is normally the behavior for autoSaveEdits:false. Are you saying you're doing something else - like saving immediately as far as databinding is concerned, but only to a client-only DataSource?

Either way, you'll want a similar approach - on collapse, tell the form to save, and cancel the collapse until it's done, then do it manually.

As far as accessing the form, lots of approaches, one of which would be to stash the form's ID on the record it's editing.

[Isomorphic]

Just noticed you updated that you were still seeing an expand/collapse issue with a 12/4 nightly. There have definitely been fixes in this area since then. If you try a new nightly and still see the issue, please let us know.

[jay.l.fisher]

I'm updating to the 12/15 build now.

This may seem like a dumb question, but if I stash the form ID in the record, how do I access the form again using it's ID? I've never accessed a form by it's ID. What is the Object.method() call to do that? I've looked over the docs and don't see anything obvious.

[Isomorphic]

Use Canvas.getById(), and remember, you can "typecast" to the appropriate class via new DynamicForm(canvas.getJsObj()).

[jay.l.fisher]

This is getting a lot more complicated that I was expecting. Here is what I have now. When I expand the row the form shows up. But when I collapse the row the browser hangs.

ListGrid myGrid = new ListGrid() {
    @Override
    protected Canvas getExpansionComponent(final ListGridRecord record) {

        final ListGrid grid = this;

        final DynamicForm df = new DynamicForm();
        df.setNumCols(4);
        df.setFields(
        		new TextAreaItem("fieldA"), 
        		new StaticTextItem("fieldB"));
        df.setDataSource(grid.getDataSource());
        df.addDrawHandler(new DrawHandler() {
            public void onDraw(DrawEvent event) {
            	record.setAttribute("formID", df.getID());
                df.editRecord(record); 
            }
        });

        return df;
    }
};
myGrid.addRecordCollapseHandler(new RecordCollapseHandler() {				
	@Override
	public void onRecordCollapse(RecordCollapseEvent event) {
		event.cancel();
		ListGridRecord record = (ListGridRecord) event.getRecord();
		DynamicForm df = new DynamicForm(Canvas.getById(record.getAttribute("formID")).getJsObj());
		df.saveData();
		myGrid.collapseRecord(record);
	}
});

[Isomorphic]

Call collapseRecord() from the callback to saveData() or else you are destroying the form while it's in the midst of saving.

[jay.l.fisher]

I tried that first and the record did not collapse. The expand/collapse icon at the left of the row indicated that it was collapsed, but the expansion form remained in place.

Just to clarify. I am doing as you suspected and "saving immediately as far as databinding is concerned, but only to a client-only DataSource"