on-click or other js events to Combo, Options, Radio, Check boxes.

[GoogleCodeExporter]

What steps will reproduce the problem?
1. Trying to add array to events with onclick to show/hide <div>s with options.
2. The yesNo object does have a way to add onclick to object.
3. No documentation on this and do not want to modify the code, I am probably 
doing something wrong.

What is the expected output? What do you see instead?
onclick > the javascript as an option, not an actual call.

What version of the product are you using? On what operating system?
PHP 5.3, Windows 7 Development Box

Please provide any additional information below.
Probably some documenation and or feature/enhancement to be able to add events 
to fields, or explain how to override them. Onclick on a options field would 
then find the selected value, and show div tag accordingly for each option.

Original issue reported on code.google.com by mar...@bajawines.mx on 19 Sep 2012 at 11:29

[GoogleCodeExporter]

Check out this example - 
http://www.imavex.com/pfbc2.x-php5/examples/conditions.php.  It's using version 
2.x, but the syntax for 3.x would be very similar.  If you remove the section 
parameter in the Form class constructor and change the two HTMLExternal 
elements to HTML, you should have a working 3.x form.

- Andrew

Original comment by ajporterfield@gmail.com on 20 Sep 2012 at 3:10

[GoogleCodeExporter]

Minor edit to my comment.  The last sentence should read, "If you remove the 
second parameter..."

Original comment by ajporterfield@gmail.com on 20 Sep 2012 at 3:22

[GoogleCodeExporter]

Yep, checked that example, but it uses the yesno object vs radio object (for 
example). So if I enter an array for the options of the radio field (not yesno, 
but 3 options for example), how can I add to that same array an onclick 
javascript event and then on that script read what value was selected? The 
yesno reads a 1 (yes) and then shows div, but the radio element, how can i add 
an onclick and then read selected option? Sorry for being persistant, but this 
library rocks and want to make sure i can do this the right way.
Example:
If onclick a radio field option, i determine selected radio and then display a 
different div, depending on the option ;)...

Saludos de Mexico!

Original comment by mar...@bajawines.mx on 20 Sep 2012 at 3:47

[GoogleCodeExporter]

It's basically the same b/c the YesNo element extends the Radio element class.  
You just need to supply your own options when adding a Radio element.

$options = array("1" => "Option #1", "2" =>  "Option #2", "3" => "Option #3");
$form->addElement(new Element_Radio("My Radio:", "MyRadio", $options, array(
    "description" => "Click \"Option 
#1\" below to show additional form elements.", 
    "onclick" => "toggleAdditionalElements(this.value);"
)));

Original comment by ajporterfield@gmail.com on 20 Sep 2012 at 1:48

[GoogleCodeExporter]

Works like a charm!

I have code for you to include in conditions.php for Version 3.x, which was 
deprecated in examples. I think with this example, people can have a better 
idea without asking too many questions.

<h2 class="first">Conditions</h2>
<p>The following example demonstrates how to show/hide one or more form 
elements based a set of conditions.  
This is achieved by using a javascript event along with the HTMLExternal 
element.</p>

<?php
$type = array("Red" , "White", "Rose");
$redcolor = array ("Color 1", "Color 2", "Color 3");
$whitecolor = array ("White 1", "Color 2", "Color 3");
$rosecolor = array ("Rose 1", "Color 2", "Color 3");

$form = new Form("conditions", 500);
$form->addElement(new Element_Hidden("form", "conditions"));

$form->addElement(new Element_HTML('<legend>Wine Color</legend>'));
$form->addElement(new Element_Radio("Select Type:", "type", $type, 
array("onclick" => "toggleAdditionalElements(this.value);")));

$form->addElement(new Element_HTML('<div id="red" style="display: none;">'));
$form->addElement(new Element_Checksort("Red Colors:", "colors", $redcolor));
$form->addElement(new Element_HTML('</div>'));

$form->addElement(new Element_HTML('<div id="white" style="display: none;">'));
$form->addElement(new Element_Checksort("White Colors:", "colors", 
$whitecolor));
$form->addElement(new Element_HTML('</div>'));

$form->addElement(new Element_HTML('<div id="rose" style="display: none;">'));
$form->addElement(new Element_Checksort("Rose Colors:", "colors", $rosecolor));
$form->addElement(new Element_HTML('</div>'));

$form->addElement(new Element_Button);
$form->render();
?>
<script type="text/javascript">
        function toggleAdditionalElements(val) {
                if(val == "Red")
                        jQuery("#red").show(200);
                else
                        jQuery("#red").hide(200);

        if(val == "White")
                        jQuery("#white").show(200);
                else
                        jQuery("#white").hide(200);
        if(val == "Rose")
                        jQuery("#rose").show(200);
                else
                        jQuery("#rose").hide(200);
        }
</script>

Original comment by mar...@bajawines.mx on 20 Sep 2012 at 3:07