Ext.ux.touch.grid

[mike lebowski]

This is a bug within DataView so we will have to wait for it to get fixed in the framework. I do not do anything special for selecting.

Any idea if this has been fixed in the RC?

[hallikpapa]

How would you handle custom rendering? I am trying to color code cells based on data returned, but one thing is passed into the renderer: the record.

Any suggestion on the best way to style a cell before rendering?

 header   : "External",
 dataIndex: 'ueid',
 style    : "text-align: center;",
 width    : 100,
 renderer : function(empty_var, rec) {
                    if (rec.m_id == rec.MozMax.ueid) {
                        console.log('This is where I want to color the cell green');
                    }
                    return rec.MozPage.ueid;
                }

[mike lebowski]

How would you handle custom rendering? I am trying to color code cells based on data returned, but one thing is passed into the renderer: the record.

Any suggestion on the best way to style a cell before rendering?

 header   : "External",
 dataIndex: 'ueid',
 style    : "text-align: center;",
 width    : 100,
 renderer : function(empty_var, rec) {
                    if (rec.m_id == rec.MozMax.ueid) {
                        console.log('This is where I want to color the cell green');
                    }
                    return rec.MozPage.ueid;
                }

Maybe I am missing your point. I am not sure what you mean by "before rendering". I am using the render method to test the value, and conditionally determine a display value, and a css class , and then I finish render like this:
return '<span class="' + cls + '">' + displayValue + '</span>';

Not sure if that helps you.

[mike lebowski]

question for Mitchell, is there a properties way to add styling (cls) to a column header?
Or that will have to be done thru css selectors? I am asking b/c I am thinking of one case where i might want different styling for certain column headers within the same grid.

[shaneavery]

@Mike Lebowski,

You asked:

Any idea if this has been fixed in the RC?

The answer is "Yes". I am using RC and it is working correctly now.

[hallikpapa]

Maybe I am missing your point. I am not sure what you mean by "before rendering". I am using the render method to test the value, and conditionally determine a display value, and a css class , and then I finish render like this:
return '<span class="' + cls + '">' + displayValue + '</span>';

Not sure if that helps you.

So simple I didn't see it. I was able to style the text, I will try and make the background a specific color too. Thanks!

What about if I wanted to change the style of a whole row background based on a value of a certain column? Is there a way with this grid plugin to select specific row and style it so it's highlighted? For instance, Say I am looping through records in the store, and if any value in the column "status" == "ok", I want to color the entire row green.

[atl]

Great component!

But i got a problem with applying features during re-open view with gridview component. The console throw me an error:

Uncaught Error: [Ext.create] Invalid class name or alias 'undefined' specified, must be a non-empty string

I debug that and it is after calling 'me.callParent(arguments)' method.

Any ideas how to workaround that??

I am having this issue too - the first time it is created fine, when I destroy and recreate it throws that error.. It appears this is the offending line:

feature = Ext.create(feature, cfg);

I'm new to this framework, but from debugging it looks like cfg.grid doesn't have a cls when recreating so I changed that line to:

if (cfg.grid.hasOwnProperty('_cls')) {
     feature = Ext.create(feature, cfg);
}

The first time it evaluates to true, but when recreating it skips that line. Not sure what the consequenses are, and I doubt its the root cause or the right approach but it works in a pinch. I am just trying to put together a mockup so it is no worries at the moment, but I would like to know why this is failing before creating an application with Sencha Touch.

[alohainc]

Hey I am new to sencha, how can I add alternate row color to Ext.ux.touch.grid?

[mitchellsimoens]

Use CSS pusedo selector.

[alohainc]

Not getting exactly how to use CSS pusedo selector in "Ext.ux.touch.grid".