Redraw events are no longer rendering after a listGrid Field is frozen.

[gbegley]

We added sparklines rendered with jquery suing the method described at

http://forums.smartclient.com/showthread.php?t=23447

Which works great, however, after the user freezes a column (using a ListGrid column heading menu), the spark lines disappear, and stop rendering from the redraw events.


It seems almost as if the observer added via JSNI (see above thread) as.

   // "this" extends ListGrid

    public void addSparklines(){
        DrawHandler dh = new DrawHandler() {
            @Override
            public void onDraw(DrawEvent drawEvent) {
                configureSparklines();
            }
        };
        FieldStateChangedHandler fsch = new FieldStateChangedHandler(){
            @Override
            public void onFieldStateChanged(FieldStateChangedEvent fieldStateChangedEvent) {
                configureSparklines();
            }
        };
        addDrawHandler(dh); // <-- works until column is frozen 
        addFieldStateChangedHandler(fsch); // <-- not useful
        getGridRenderer().addDrawHandler(dh); // <-- not useful
    }

    public native void configureSparklines()/*-{
        console.log('called ConfigureSparklines');
	    var self = this.@com.smartgwt.client.widgets.BaseWidget::getOrCreateJsObj()();
	    var body = self.body;
	    if (body == null) return;
	    self.observe(body, "redraw", "GppHistograms.update()");
	    body.redraw();
	}-*/;

was removed when a column is frozen.

I expect I need to add a hook into column freezing that reestablishes the 'redraw' event observer.

I tried to override freezeField(String) and freezeField(int) and this didn't work. I also tried to add a drawHandler and field state change listeners that referenced in the above comments, but these did not solve my 'freezing' problem.

Ideas?

Using SmartGWT 3.1
SmartClient Version: v8.3p_2012-12-02/Enterprise Deployment (built 2012-12-02)

[Isomorphic]

The handler is not removed, but a ListGrid with frozen columns now has more than one "body" (by necessity - two components are needed to represents two separately scrollable regions).

The second body is available in JS as grid.frozenBody and is also an instance of GridRenderer. Frozen columns appear in this body, other columns appear in the normal body.

[gbegley]

Frozen body is null when draw handler is executed.

The redraw handler "GppHistograms.update()" prints a logging message as it's first statement, which stops printing after a column is frozen in the list Grid. This observation is what led me to believe that the redraw handler was no longer being called after a column freeze.

I modified the configure method to the following:

    public native void configureSparklines()/*-{
        console.log('called ConfigureSparklines');
	    var self = this.@com.smartgwt.client.widgets.BaseWidget::getOrCreateJsObj()();
	    var body = self.body;
	    if (body != null) {
            self.observe(body, "redraw", "GppHistograms.update()");
            body.redraw();
        }
        var frozenBody = self.frozenBody;
        if(frozenBody!=null) {
            self.observe(frozenBody, "redraw", "GppHistograms.update()");
            frozenBody.redraw();
        } else {
            console.log('Frozen body is null');
        }
	}-*/;

"Frozen body is null" was in my log output from the component initialization, which I would have expected as this is executed before any columns are frozen.

Is there a way to set up an observer that will be notified when a column is frozen, which can then take some sort of action when the user freezes a column?

Is their another better way to handle this use case?
I really just want to call

GppHistograms.update()

any time the grid rows are changed through filtering or scrolling.

[Isomorphic]

FieldStateChanged fires when columns are frozen. There's no need to set up an observer. But your sparklines code will need to be adjusted for the fact that cells appear in two different bodies regardless.

[gbegley]

This code is working

Re-adding the handlers when a FieldStateChangedEvent is observed did the trick.

    public void addSparklines(){
        DrawHandler dh = new DrawHandler() {
            @Override
            public void onDraw(DrawEvent drawEvent) {
                configureSparklines();
            }
        };
        FieldStateChangedHandler fsch = new FieldStateChangedHandler(){
            @Override
            public void onFieldStateChanged(FieldStateChangedEvent fieldStateChangedEvent) {
                configureSparklines();
            }
        };
        addFieldStateChangedHandler(fsch);
        addDrawHandler(dh);
	}

    public native void configureSparklines()/*-{
        console.log('called ConfigureSparklines');
	    var self = this.@com.smartgwt.client.widgets.BaseWidget::getOrCreateJsObj()();
	    var body = self.body;
	    if (body != null) {
            self.observe(body, "redraw", "GppHistograms.update()");
            body.redraw();
        }
        var frozenBody = self.frozenBody;
        if(frozenBody!=null) {
            console.log('Frozen body is not null, setting up observing frozenBody redraw');
            self.observe(frozenBody, "redraw", "GppHistograms.update()");
            frozenBody.redraw();
        } else {
            console.log('Frozen body is null');
        }
	}-*/;

Thanks for the help!

[gbegley]

What is the alternative to an observer?

Rereading the thread, I see ISO said there was no need to set up an observer.

How should I have done it instead?

[Isomorphic]

There is no need to set up an observer for FieldStateChanged since it's already set up as an event you can hook in Java.

There are alternatives to observing redraw via JSNI instead, but they are equally complex so no need to get into them.