HTML5 validation not working in IE and Safari

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:

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

Upvotes: 1

Views: 3599

Answers (3)

David Silva Smith
David Silva Smith

Reputation: 11716

I used the jQuery Validation Plugin

<script type="text/javascript">
        window.onload = function() {
              var button = document.getElementById("submit-button");
              button.onclick = function() {
                $('#form-name').validate();
                if( $('#form-name').valid() == false) {
                  return false;
                    }
                }
            };
    </script>

Upvotes: 0

Mohit Bumb
Mohit Bumb

Reputation: 2493

Use parsley library it supports cross browser validations for reference check this link : http://www.247techblog.com/use-html5-validations-internet-explorer-tutorial-guide/

Upvotes: 0

Ja͢ck
Ja͢ck

Reputation: 173562

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 :)

Upvotes: 1

Related Questions