How to declare a script variable to hold attribute value in jQuery seaside

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

How to declare a script variable to hold attribute value in jQuery seaside

Jaya L
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

Reply | Threaded
Open this post in threaded view
|

Re: How to declare a script variable to hold attribute value in jQuery seaside

Max Leske
Hi Jaya,

you should either post this on StackOverflow or take to the seaside mailing list. People there are more likely able to help you.

Cheers,
Max

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


Reply | Threaded
Open this post in threaded view
|

Re: How to declare a script variable to hold attribute value in jQuery seaside

Max Leske
In reply to this post by Jaya L
Seaside mailing list: http://seaside.st/community/mailinglist


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


Reply | Threaded
Open this post in threaded view
|

Re: How to declare a script variable to hold attribute value in jQuery seaside

Johan Brichau-2
In reply to this post by Jaya L
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


Reply | Threaded
Open this post in threaded view
|

Re: How to declare a script variable to hold attribute value in jQuery seaside

Jaya L
In reply to this post by Max Leske
Thank you Max.
Reply | Threaded
Open this post in threaded view
|

Re: How to declare a script variable to hold attribute value in jQuery seaside

Jaya L
In reply to this post by Johan Brichau-2
Thank you Johan.

I used JSStream on:  method. It is working fine now.