View Full Version : Resolved Multi-Answer Script?
Hey guys! I've been searching for a multi-answer script for a 'sort of' quiz I'm making (it's not really a quiz, but I figure it's a similar concept).
Example of what I want:
Please Select which recipe you'd like:
[checkbox1] Chocolate Brownies
[checkbox2] Chocolate Chip Cookies
[checkbox3] Strawberry Cake
[checkbox4] Apple Pie
|Submit|
If they choose only Chocolate Brownies, then it'll take them to a page with just the brownie recipe, but if they choose Chocolate Brownies and Chocolate Chip Cookies it should take them to a second page I'll make with both recipes on it, etc. I know it's a lot of pages based on how many possible selections, but that's as far as my knowledge goes on how to do this. Any help would be SO appreciated!
Thanks,
Shia
EDIT: I'd like the new information to appear in a new window for easy printing.
Philip M
07-13-2010, 08:04 PM
This is a better way forward. Place the recipes in divs which are revealed when the checkboxes are checked.
<form name = "myform">
<input type = "checkbox" name = "box"> Chocolate Brownies
<input type = "checkbox" name = "box"> Chocolate Chip Cookies
<input type = "checkbox" name = "box"> Strawberry Cake
<input type = "checkbox" name = "box"> Apple Pie
<br>
<input type = "button" value = "Show recipes for selected items" onclick = "show()">
</form>
<div id = "R0" style="display:none">Recipe for Chocolate Brownies<br><br></div>
<div id = "R1" style="display:none">Recipe for Chocolate Chip Cookies<br><br></div>
<div id = "R2" style="display:none">Recipe for Strawberry Cake<br><br></div>
<div id = "R3" style="display:none">Recipe for Apple Pie<br><br></div>
<script type = "text/javascript">
function show() {
for (var i=0; i<document.myform.box.length; i++) {
var index = "R" + i;
document.getElementById(index).style.display="none";
}
for (var i=0; i<document.myform.box.length; i++) {
var index = "R" + i;
if (document.myform.box[i].checked) {
document.getElementById(index).style.display="block";
}
}
}
</script>
The one thing that unites all human beings, regardless of age, gender, religion, economic status, or ethnic background, is that, deep down inside, we all believe that we are above-average drivers.
This is a better way forward. Place the recipes in divs which are revealed when the checkboxes are checked.
<form name = "myform">
<input type = "checkbox" name = "box"> Chocolate Brownies
<input type = "checkbox" name = "box"> Chocolate Chip Cookies
<input type = "checkbox" name = "box"> Strawberry Cake
<input type = "checkbox" name = "box"> Apple Pie
<br>
<input type = "button" value = "Show recipes for selected items" onclick = "show()">
</form>
<div id = "R0" style="display:none">Recipe for Chocolate Brownies<br><br></div>
<div id = "R1" style="display:none">Recipe for Chocolate Chip Cookies<br><br></div>
<div id = "R2" style="display:none">Recipe for Strawberry Cake<br><br></div>
<div id = "R3" style="display:none">Recipe for Apple Pie<br><br></div>
<script type = "text/javascript">
function show() {
for (var i=0; i<document.myform.box.length; i++) {
var index = "R" + i;
document.getElementById(index).style.display="none";
}
for (var i=0; i<document.myform.box.length; i++) {
var index = "R" + i;
if (document.myform.box[i].checked) {
document.getElementById(index).style.display="block";
}
}
}
</script>
Thanks for responding! The only problem with this is that I'd like the recipes to be in a new window by themselves for easy printing.
EDIT: I decided to simply life and make a special CSS for printing ONLY the recipe divs that display after being checked. This solves my printing problem so it's clean and easy. Problem solved.
vBulletin® v3.8.2, Copyright ©2000-2012, Jelsoft Enterprises Ltd.