PDA

View Full Version : Advanced Form solution pack Modification


jon333783
01-28-2010, 05:18 PM
Hi Guys and thanks in advance for your help.

Here is what i am trying to achive.

1. Form to open in thick box. (got that covered)

2. First part of the form will require client to choose one check box from three options.

3. Once a check box has been chosen the content output to the remaining form will have different questions shown for the client depending on her first check box choice. For example

If client one chosed check box 2 her questions would include such things as , name address, email, phone number, but if she chose check box 3 further questions would be added to the form such as business name, website etc. as well as the form options for check box option 2.

I must add that this is not something i have started yet but would love to know if anoyine out there has either done this and can give me instructions or if it not been done yet maybe some can still point me in the right direction.

I hope that i have made it clear, please feel free to let me know if you need more info.

Thanks again in advance

Eric Mittman
01-29-2010, 10:44 AM
You could do something like this with CSS Form Builder or the Validation Toolkit. Using client side validations you can have have areas on the form hide or show based on the validation of a form element.

For example, if you applied a client side required validation on the checkbox, you would then apply a show/hide validation response that will make another part of the form visible.

I'm including a sample page of what this type of setup looks like as an example. Please post back with any questions that you have about any part of this.

jon333783
01-31-2010, 11:21 AM
Many Thanks, I will try this and post back to let you know how I got on.

Jon

jon333783
01-31-2010, 03:37 PM
Hi all,

I found a solution that worked and was easy to impliment.

Becuase I had a lot of extra fields to add if a check box was checked, hiding a "Div" was more appropiate.

Here is what i did.

Added

<head>

<script type="text/javascript">
<!--
function showMe (it, box) {
var vis = (box.checked) ? "block" : "none";
document.getElementById(it).style.display = vis;
}
//-->
</script>

</head>

Added

onclick="showMe('webdet', this) to the input type

<input type="checkbox" name="Membership_Required[]" id="Privileged_Member_Plus" value="Privileged Member Plus" onclick="showMe('webdet', this)" />

Created a new "Div" called webdet

Toptip.

Create your divide and add your form elements before you add the javascript to the head and the onclick code. If you add them before, you will only see your div form elements in code view.

Hope that this helps

Jonathon

Eric Mittman
02-01-2010, 02:43 PM
Good solution. You can do a lot of very handy things with client side js. The approach that I was suggesting also uses client side js but relies on the interfaces to write the code for you rather than implementing it in a custom fashion.