[Seaside] How do I use JQuery with Javascript variable

Francisco Martins chicoary at gmail.com
Fri Feb 10 20:57:13 UTC 2012


Johan, I did some research and with help of a co-worker detected the
cause of themalfunction. Now it works! A string containing the
javascript can be generated inSmalltalk using apostrophes repeated. As
for quotes no problem. The code to render the radio buttons was using
group, which prevented the "values" ​​were rendered. I made a version
that worked obstrusive. See below:

renderContentOn: html
	html
		form: [
			html
				div: [
					(html label)
						for: #radioYes;
						with: 'What is your answer?'.
					(html radioButton)
						id: #radioYes;
						name: #someRadioGroup;
						selected: true;
						value: 'yes';
						with: 'Yes'.
					(html radioButton)
						id: #radioNo;
						name: #someRadioGroup;
						value: 'no';
						with: 'No'.
					(html radioButton)
						id: #radioMaybe;
						name: #someRadioGroup;
						value: 'maybe';
						with: 'Maybe'.
					(html radioButton)
						id: #radioConfused;
						name: #someRadioGroup;
						value: 'confused';
						with: 'I dunno' ].
			html
				div: [
					(html button)
						type: #button;
						id: #testButton;
						class: #green90x24;
						onClick:
								'var checkedValue = $(''[name="someRadioGroup"]:radio:checked'').val();
									$(''#result'').html(''The radio element with value <tt>''+
checkedValue +''</tt> is checked.'');';
						with: 'Which?' ].
			html div id: #result ]


Then I had the idea of ​​making a non-obstrusive, which also worked. See below:
renderContentOn: html
	html document
		addLoadScript: ((html jQuery: #testButton)
				onClick: 'var checkedValue =
$(''[name="someRadioGroup"]:radio:checked'').val();
							$(''#result'').html(''The radio element with value <tt>''+
checkedValue +''</tt> is checked.'');').
	html
		form: [html
				div: [html label for: #radioYes;
						 with: 'What is your answer?'.
					html radioButton id: #radioYes;
						 name: #someRadioGroup;
						 selected: true;
						 value: 'yes';
						 with: 'Yes'.
					html radioButton id: #radioNo;
						 name: #someRadioGroup;
						 value: 'no';
						 with: 'No'.
					html radioButton id: #radioMaybe;
						 name: #someRadioGroup;
						 value: 'maybe';
						 with: 'Maybe'.
					html radioButton id: #radioConfused;
						 name: #someRadioGroup;
						 value: 'confused';
						 with: 'I dunno'].
			html
				div: [html button type: #button;
						 id: #testButton;
						 class: #green90x24;
						 with: 'Which?'].
			html div id: #result]

The version below to render the radio buttons do not work because the
"group" that prevents the "values" are rendered:

                                          html
						radioGroup: [:group |
							html radioButton id: #radioYes;
								 group: group;
								 name: #someRadioGroup;
								 value: #yes;
								 selected: true;
								 with: 'Yes'.
							html radioButton id: #radioNo;
								 group: group;
								 name: #someRadioGroup;
								 value: #no;
								 with: 'No'.
							html radioButton id: #radioMaybe;
								 group: group;
								 name: #someRadioGroup;
								 value: #maybe;
								 with: 'Maybe'.
							html radioButton id: #radioConfused;
								 group: group;
								 name: #someRadioGroup;
								 value: #confused;
								 with: 'I dunno']].

Thanks for your attention that helped me in solving the problem.

--
Sds.,

Francisco Ary Martins
http://chicoary.wordpress.com
----
"A filosofia não é senão uma poesia sofisticada."
Montaigne


More information about the seaside mailing list