SHtml.radioElems hidden field

[Daniel Hobi]

Hi there

I just faced an "attributes do not get merged on first radio button" issue while "migrating" from SHtml.radio to SHtml.radioElem.
It turns out that SHtml.radioElem adds a hidden field to the first ChoiceItem (xhtml), so instead of having just
<input type="radio" ..>
the first ChoiceItem (xhtml) becomes
<input type="radio" ../><input type="hidden" .../>
which does not play nicely with CSS Selector Transforms.

Can someone explain me, why this hidden field is added to the first elem?
Without touching the rest of the code removing the hidden field just worked fine for me...

Thanks!
Daniel

[Richard Dallaway]

I suspect that hidden value is to ensure the Box[T] => Any function you give to radioElem is executed when the form is submitted. The radioElem is creating random values for each of your Ts, and on submit it need to reuse those values to decode the submitted value back to a T.

--
--
Lift, the simply functional web framework: http://liftweb.net
Code: http://github.com/lift
Discussion: http://groups.google.com/group/liftweb
Stuck? Help us help you: https://www.assembla.com/wiki/show/liftweb/Posting_example_code
 
---
You received this message because you are subscribed to the Google Groups "Lift" group.
To unsubscribe from this group and stop receiving emails from it, send an email to liftweb+u...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Daniel Hobi]

Hi Richard

After rereading your post several times and having a closer look at the code I think I finally have understood the case :-)
If you have a radio group and no one of the radio buttons is checked the onSubmit will be called with Empty. If we wouldn't have the hidden input field, the onSubmit function wouldn't be called at all and the information "the user did not select anything" would be lost.

Thanks for your answer and leading me in the right direction!
Daniel

[Richard Dallaway]

Glad it helped.  All I meant is: if you use SHtml.radio you get HTML like...

<input type="radio" value="My First Option">

(from memory!)

If you use SHtml.radioElem you'd get....

<input type="radio" value="F123456">

(also from memory!)

...and the hidden value you're seeing triggers a server-side function when the form is submitted to take the selected F123456 value and turn it back into whatever it should be and pass it on to your function as a Full[T] or Empty.

I need to go check that. I feel a recipe coming on....

[Daniel Hobi]

Yes, every SHtml.generic[T] has this effect on the name attribute.
Afaik every field (the radios and the hidden one) will trigger the onSubmit function. BUT: if no radio button is selected they will not trigger the function because they will not be sent via request when unchecked (html specs?). That's where the hidden field jumps in because it will always be sent, triggering the onSubmit function with Empty and let the backend know that no radio button has been selected.

Daniel

[Richard Dallaway]

I've now written some of this up...

http://cookbook.liftweb.net/#Radio

Seem OK?

Richard

Daniel

--
--
Lift, the simply functional web framework: http://liftweb.net
Code: http://github.com/lift
Discussion: http://groups.google.com/group/liftweb
Stuck? Help us help you: https://www.assembla.com/wiki/show/liftweb/Posting_example_code

---
You received this message because you are subscribed to the Google Groups "Lift" group.

[Daniel Hobi]

Hi Richard

Thx for the write up.
"The hidden value maps to a function that’s called when the form is submitted, and by using the common "name" value on the fields, it is able to pick out the selected radio button and identify the corresponding BirthGender value and pass it to our code."
The hidden field is only there to give the backend the possibility to detect, that no selection has been made.
Test:
1. Delete the hidden input field, make a selection, submit the form => works as expected
2. Delete the hidden input field, make sure that no radio button is selected, submit the form => the function in the backend will not be called
3. Leave the hidden input field, make sure that no radio button is selected, submit the form => the backend function will be called with Empty

Daniel

[Richard Dallaway]

Thanks Daniel - I've re-worked that part.

Cheers

Richard

Daniel

[Daniel Hobi]

Great! Now I'm happy ;-)

Daniel

[earthling_paul]

Thanks for that!

Just two minor remarks:

1)
The text here:
logger.info("Choice: "+selected)
does not match the text here:
INFO  code.snippet.Radio - Selected radio is: Empty

2)
In the "HTML produced by radioElem" the <br> should probably be <br/>

So if SHtml.radioElem is a typesafe and more sophisticated alternative to SHtml.radio:
For the sake of completeness - shouldn't SHtml.ajaxRadio be mentioned as well? Just how it compares to radioElem / radio.

Regards
Paul

[Richard Dallaway]

Thank you for the corrections. 

There needs to be a separate recipe for ajaxRadio, and a See Also link to it.  I'll get round to it, possibly next month, unless anyone gets there first.

Cheers

Richard