Question

I am trying to validate a Select field in using HTML5; it’s working perfectly fine in Chrome and FF browser, but when I tried in IE and Safari, it’s not working. I tried using a JavaScript to get it to work, but I’m still having the same problem. Please help me out. The sample of my code is here:

• http://i1159.photobucket.com/albums/p637/Apulo_Cosmas/validate.jpg

How can I fix it so the same code works with all four browsers?

Answer 1

Instead of an onclick on the submit button, it’s better to have this:

<script type="text/javascript">
function validate(f) {
    if (f.empty.value == '') { alert('you must enter text'); return false; }
    if (f.select_box.value == '') { alert('you must select something'); return false; }
}
</script>

<form name="form1" action="test2" onsubmit="return validate(this)">
...
<input type="submit" value="Go!" />
</form>

Edit: The validate(this) will call the validate function and pass itself (the form) as f. Then, the fields within the form can be refered to by name (e.g. empty and select_box)

Hope this helps 🙂