Question

I am writing some code based around jqGrid and I’ve come across a problem relating to the rendering of empty cells.

I use JSON to return the data to render and when there is no value, instead of just outputting nothing, jqGrid outputs a space instead. This is causing problems because I need to trigger a function if the cell is empty.

I have looked at the returned JSON using Firebug and it is definitely correct, there is no space being returned.

Looking at the latest jqGrid demo this problem can be replicated:

1. Visit http://trirand.com/blog/jqgrid/jqgrid.html
2. Look at any demo grid which contains an empty cell and “Inspect this element” in Firebug.
3. You will note that this demo grid does the same thing

I appreciate this is likely for validity reasons but is there a workaround for this? At the moment my working selector reads:

$(".jqgrow td:not(:first-child)")

I have tried to use :contains as below to combine them but not had any luck so far:

$(".jqgrow td:not(:contains(' '))")
$(".jqgrow td:not(:contains(' '))")
$(".jqgrow td:not(:contains(' '))")

I would appreciate any assistance!

UPDATE 1:

I have produced this jsFiddle which expands on the problem: http://jsfiddle.net/fJZst/

I’ve copied one line from my table to keep it as simple as possible. On the demo, if you mouse over a cell which doesn’t contain a space you’ll get an alert. If it does contain a space, you won’t. If you substitute the alert for a tooltip in your head, the selector looks good. If I try this in jqGrid the alert always fires so I’m a little more confused..

Answer 1

$('.jqgrow tr td').filter(function() {
        return $.trim($(this).text()) != ''
});