Flexigrid -- onClick / doubleClick

[Rob]

Hi,

Is there any way to call a function when a row in a flexigrid is
clicked or double-clicked. I've looked at documentation for
js_callback back this seems to be only for buttons passed as
parameters to the widget.

I'd be very grateful if someone could help or point me in the right
direction.

Many thanks,
Rob

[Rob]

I think I have made some progress with this but haven't yet arrived at
a working solution (or know if there is one).

Essentially, I have a working grid (columns and data are being
rendered perfectly) however what I wish to do is process a click/
doubleClick event.
From com.googlegroups.flexigrid, I have seen that the colModel can be
constructed with a 'process' parameter along the lines of:

colModel = [
{'display':'id', 'name':'id', 'width':20,
'align':'center', 'process': "procMe" }, # quotes around "procMe"
are intentional for the time being
{'display':'col1', 'name':'Col1', 'width':100,
'align':'left' },
]

with javascript function defined as:

function procMe(celDiv,id) {
$(celDiv).click
(
function () {alert(this.innerHTML); }
);
}


However, (problem #1) when I add 'process' to one or all columns, the
rendered widget (incorrectly) displays all of the column data inside
of the first column.

So my question is, how (and where) is the procMe function defined? And
should it be applied to one, or all of the columns?

Should "procMe" be defined as a js_callback? (along the lines of:
'process': js_callback("procMe"), and the procMe function added to
the template?

I really would be grateful for any assistance that you can offer!

Thanks,
Rob

[Sanjiv Singh]

Yes, that is correct. I tested it and it seems to work for me.

Sanjiv

[Robert Sudwarts]

Hi Sanjiv,

Thank you for your response!  I haven't managed to get this working yet ... as soon as I have, I will post exactly what I've done on the forum because I'm not the only person who has had difficulty with this.

So... 

a)   'process'  works (that's great news!!)

b)  the js function needs to be added to the colModel as a parameter   ... 'process' : js_callback('someFunction')   ?

c)  the (in my case genshi template) needs to have (within it) a javascript function:   someFunction() {...}   ?

Is that the solution....??

Regards,

Rob

2009/10/26 Sanjiv Singh <singhs...@gmail.com>

[Sanjiv Singh]

On Mon, Oct 26, 2009 at 11:50 PM, Robert Sudwarts
<robert....@googlemail.com> wrote:
> Hi Sanjiv,
> Thank you for your response!  I haven't managed to get this working yet ...
> as soon as I have, I will post exactly what I've done on the forum because
> I'm not the only person who has had difficulty with this.
> So...
> a)   'process'  works (that's great news!!)
> b)  the js function needs to be added to the colModel as a parameter   ...
> 'process' : js_callback('someFunction')   ?

Yes

> c)  the (in my case genshi template) needs to have (within it) a javascript
> function:   someFunction() {...}   ?
> Is that the solution....??

Yes. someFunction(celDiv,id)

Sanjiv

[Rob]

Sanjiv,

I hate to say it, but think I may have come across a 'bug' ...

In my controller I have:
procMe = js_callback('procMe')

and,

colModel = [
{'display':'id', 'name':'id', 'width':20,
'align':'center', 'process': procMe},

{'display':'ticker', 'name':'ticker','width':100,
'align':'left', 'process': procMe},
{'display':'type', 'name':'type', 'width':80,
'align':'left', 'process': procMe},
{'display':'px freq','name':'pricing_frequency', 'width':
90, 'align':'left', 'process': procMe}
]

I have run this *with* and *without* the ..... 'process': procMe}

The HTML (copied below) which is generated for the table might
indicate why I'm having problems. I've indented the HTML in the hope
of making them easier to read, but hopefully you can see what I'm
getting at....
Introducing the 'process': procMe is somehow pushing the table
structure out of shape.

Do you have any idea why this could be?

Many thanks,
Rob

*Without* the ....'process': procMe} [renders correctly]

<div class="bDiv" style="height: 400px;">
<table id="flex" cellspacing="0" cellpadding="0" border="0"
style="display: table;">
<tbody>
<tr id="row18">
<td align="center">18</td>
<td align="left">ADEN FP Equity</td>
<td align="left">equity</td>
<td align="left">daily</td>
</tr>
<tr id="row16" class="erow">
<td align="center">16</td>
<td align="left">ADEN VX Equity</td>
<td align="left">equity</td>
<td align="left">daily</td>
</tr>
<tr id="row11"> etc etc etc

*With* the .... 'process':procMe} I get the following [doesn't
render correctly]:

<div class="bDiv" style="height: 400px;">
<table id="flex" cellspacing="0" cellpadding="0" border="0"
style="display: table;">
<tbody>
<tr id="row18">
<td align="center">
<div style="text-align: center; width: 20px;">18</div>
</td>
<td class="sorted" align="left">
<div style="text-align: left; width: 100px;">ADEN FP
Equity</div>
</td>
<td align="left">
<div style="text-align: left; width: 80px;">equity</div>
</td>
<td align="left">
<div style="text-align: left; width: 90px;">daily</div>
</td>
</tr>
<tr id="row16" class="erow">
<td align="center">
<div style="text-align: center; width: 20px;">16</div>
</td>
<td class="sorted" align="left">
<div style="text-align: left; width: 100px;">ADEN VX Equity</
div>
</td>
<td align="left">
<div style="text-align: left; width: 80px;">equity</div>
</td>
<td align="left">
<div style="text-align: left; width: 90px;">daily</div>
</td>
</tr>
<tr id="row11"> etc etc etc

On Oct 26, 6:25 pm, Sanjiv Singh <singhsanj...@gmail.com> wrote:
> On Mon, Oct 26, 2009 at 11:50 PM, Robert Sudwarts
>

> <robert.sudwa...@googlemail.com> wrote:
> > Hi Sanjiv,
> > Thank you for your response!  I haven't managed to get this working yet ...
> > as soon as I have, I will post exactly what I've done on the forum because
> > I'm not the only person who has had difficulty with this.
> > So...
> > a)   'process'  works (that's great news!!)
> > b)  the js function needs to be added to the colModel as a parameter   ...
> > 'process' : js_callback('someFunction')   ?
>
> Yes
>
> > c)  the (in my case genshi template) needs to have (within it) a javascript
> > function:   someFunction() {...}   ?
> > Is that the solution....??
>
> Yes. someFunction(celDiv,id)
>
> Sanjiv
>
> > Regards,
> > Rob
>

> > 2009/10/26 Sanjiv Singh <singhsanj...@gmail.com>
>
> >> On Mon, Oct 26, 2009 at 9:37 PM, Rob <robert.sudwa...@googlemail.com>

[Rob]

please forgive me. The two HTML excepts are the wrong way round....
the first section of HTML is where the table is rendered 'incorrectly'
ie *with* the 'process':procMe

[Sanjiv Singh]

This is likely to be a flexigrid issue and not TW. So discussing this
on their mailing list at http://groups.google.com/group/flexigrid
might help.

thanks
Sanjiv

[Robert Sudwarts]

Thanks Sanjiv. I solved this 'problem' in the wee hours last night...

It was a js_callback issue (the reference to the javascript function was being inserted with quotes)

in other words,  'process': js_callback('procMe') [in the python code] was inserted (incorrectly) in the generated javascript as { ... process: "procMe" ...)

For other users who bump into the same problem, examine the 'flex'  javascript in the HTML, and if you see the function in quotes, you will need to  install the patch (ie replace "js.py" with the newer version.)

Please see: http://groups.google.com/group/toscawidgets-discuss/browse_thread/thread/d1add406ad1dbc6d for the discussion.

and: http://toscawidgets.org/trac/tw/ticket/30  for the solution by srlindemann

In the meantime, Sanjiv,  thank you for your help (and indeed your excellent work on the widgets themselves) -- it really is much appreciated.

Regards,

Rob 

2009/10/29 Sanjiv Singh <singhs...@gmail.com>