Re: [Pharo-dev] How to declare a script variable to hold attribute value in jQuery seaside

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

Re: [Pharo-dev] How to declare a script variable to hold attribute value in jQuery seaside

Johan Brichau-2
Hi Jayla,

The script you generate executes an ajax call to the server to set the value of ‘data-tab’ and the code after that call was generated with the value of ‘self tabId’ at the time of generation (which was probably nil).
Mind that unless you need the ‘data-tab’ value on the server-side, it does not make sense to pass the value to the server, nor to generate this script with Seaside, but this should work:

html document
addLoadScript:
((html jQuery: 'ul.tabs li')
onClick:
(html jQuery ajax
callback: [ :val | self tabId: val ]
value: (html jQuery this attributeAt: 'data-tab’);
script: [:s | s << 
                                                  ((s jQuery: 'ul.tabs li') removeClass: 'current'),
  ((s jQuery: '.tab-content') removeClass: 'current'),
                                                  (s jQuery this addClass: 'current'),
((s jQuery id: self tabId) addClass: 'current’)) ]).

The important part to understand here is _when_ the script is generated. If it needs a value from the server, you can only generate it when the server has that value.

Hope this helps,
Johan

On 06 Nov 2015, at 04:02, Jayalakshmi Lade <[hidden email]> wrote:

Hi,

I am new to jQuery in seaside and trying to convert the below jQuery script to seaside jQuery for activating tabs and to render the related data but on another tab click getting val as 'undefined'. 

jQuery script:

$(document).ready(function(){
$('ul.tabs li').click(function(){
var tab_id = $(this).attr('data-tab');

$('ul.tabs li').removeClass('current');
$('.tab-content').removeClass('current');

$(this).addClass('current');
$("#"+tab_id).addClass('current');
})
})

My Converted jQuery code in seaside:

html document
addLoadScript:
((html jQuery: 'ul.tabs li')
onClick:
(html jQuery ajax
callback: [ :val | self tabId: val ]
value: (html jQuery this attributeAt: 'data-tab')),
                                                 ((html jQuery: 'ul.tabs li') removeClass: 'current'),
((html jQuery: '.tab-content') removeClass: 'current'),
                                                 (html jQuery this addClass: 'current'),
((html jQuery id: self tabId) addClass: 'current')).


Please give me your valuable suggestions on this. 
Thank you and looking forward for your reply.

Regards,


Jaya L



_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside