I have a form that I am trying to print all the values to an alert box. I have figured it all out except how to print the value of multiple checkboxes if checked here is the code. I am just trying to print in the window.alert if one of more of the checkboxes are checked.
html
<form action = "">
<p>
<label> Name:
<input type = "text" id="name" name= "name"
size "30" /> </label>
<br/>
<label> Street Address
<input type = "text" id="street" name= "street"
size "30" /> </label>
<br/>
<label> City, State, Zip
<input type = "text" id="city" name= "city"
size "30" /> </label>
</p>
<p>
<h2> Main Dish </h2>
<select id= "mainDish" >
<option id="steak"> steak </option>
<option id="chicken"> chicken </option>
<option id="shrimp"> shrimp </option>
<option id="fish"> fish </option>
</select>
</p>
<p>
Side Dishes:
</p>
<p>
<label>
<input type = "checkbox" id="fries" " value = "Fries" checked = "checked"/>Fries</label>
<label>
<input type = "checkbox" id="salad" value = "salad" />Salad</label>
<label>
<input type = "checkbox" id="coleslaw" value = "coleslaw" />Coleslaw</label>
</p>
<p>
Drink:
</p>
<p>
<label>
<input type = "radio" name = "drink" id="r1" value = "yes" checked = "checked"/>Yes</label>
<label>
<label>
<input type = "radio" name = "drink" id="r2" value = "no" />no</label>
<label>
<label>
<input type = "radio" name = "drink" id="r3" value = "water" />Water</label>
<label>
</p>
<p>
Comments:
</p>
<p>
<textarea Name = "comments" id="comments" rows = "4" cols = "40">
(enter Comments here)
</textarea>
</p>
Username: <input type="text" name="user"/>
<br>
Password: <input type="password" name="password" size= "10" maxlength = "10" />
<p>
<input type = "Submit" value = "Submit Form" />
<input type = "reset" value = "Reset Form" />
</p>
<button onclick="LerL_display()">Try it</button>
</form>
<script type="text/javascript" src="LerL_FormID.js" ></script>
</body>
javascript
function LerL_display() {
var name = document.getElementById("name").value;
var street = document.getElementById("street").value;
var city = document.getElementById("city").value;
var mainDish = document.getElementById("mainDish");
var selectedText = mainDish.options[mainDish.selectedIndex].text;
if (document.getElementById('r1').checked)
{
var drink_value = document.getElementById('r1').value;
}
else if (document.getElementById('r2').checked)
{
var drink_value = document.getElementById('r2').value;
}
else if (document.getElementById('r3').checked)
{
var drink_value = document.getElementById('r3').value;
}
window.alert(name + "\n" + street + "\n" + city + "\n" + selectedText + "\n" + drink_value);
}
}
Aucun commentaire:
Enregistrer un commentaire