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

[Johan Brichau]

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 <jayalakshmi.lade at solteco.biz> 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
> 

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.squeakfoundation.org/pipermail/seaside/attachments/20151106/e69f86ff/attachment-0001.htm