Reputation: 19
In my shop, there are some orders without option selected(Bypassing javascript alert) on some web browser. what's the best javascript to reponse to various web browser include IE 9.
Here is Code.
JS
function doCart() {
if ( document.form1.opt1 != null && document.form1.opt1.value == "" ) {
alert("Please Select Options");
} else if ( document.form1.opt2 != null && document.form1.opt2.value == "" ) {
alert("Please Select Options");
} else if ( document.form1.opt3 != null && document.form1.opt3.value == "" ) {
alert("Please Select Options");
} else {
document.form1.action = "/order/cartaction.jsp";
document.form1.submit();
}
}
HTML
<TABLE id="detail" cellpadding=3>
<TR>
<TD width=110 class="atitle">Size/Color</TD>
<TD style="LETTER-SPACING: -1px" align="left">
<select name="opt1" class="select_detail">
<option>Size/Color</option>
<option>--------</option>
<option value="BLACK/34A">BLACK/34A</option>
<option value="BLACK/34B">BLACK/34B</option>
</select>
</TD>
</TR>
<TR>
<TD class="atitle">Bottom</TD>
<TD style="LETTER-SPACING: 1px" align="left">
<select name="opt2" class="select_detail">
<option>Bottom</option>
<option value="Black/S">Black/S</option>
<option value="Almond/S">Almond/S</option>
</select>
</TD>
</TR>
</TABLE>
<a href="javascript:doCart();"><img src="/images/list/doCart.gif"></a>
Upvotes: 0
Views: 478
Reputation: 1312
have you tried document.getElementsByName("opt3")[0].value or assign an id to the select elements and do document.getElementById("opt3").value? I truly believe this solutions should be cross-browser ones...
Upvotes: 0
Reputation: 201896
Quick fix: Change the first two option
elements of the first select
element and the first option
element of the second select
element so that they have the attribute value=""
. E.g., <option value="">Size/Color</option>
.
The reason is that by default, the value
property of an option
element has its value taken from the content of the option
element. So in your case, document.form1.opt1.value
is initially Size/Color
.
Upvotes: 2