2

I am wondering if the form validation with Safari Browser (MAC OS and Version 7.0.4 (9537.76.4)) when using input type="number" is not working properly: When visiting
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_max_min
with Safari Browser I expect that I would get a warning when I enter a letter or a number outside the specified range into the "Quantity" field. But nothing happens and the input is sent to the server...
When using Chrome I get a warning...
I also have checked the http://html5test.com site and it states that the input type number and the min and max attribute are supported. But why then is it not working?? What am I doing wrong or what am I not understanding?

Any help greatly appreciated...

Thanks Tobi

Edited: As Frank Conijn mentions it is not really working with Safari. I now solved it with Javascript (Check all number input fields if they contain a number and if it is within the specified bounds): 

$("input[type='number']").change(function(){
    var maxValue = parseInt($(this).attr('max'));
    var minValue = parseInt($(this).attr('min'));
    var enteredValue = parseInt($(this).val());

    if($.isNumeric(enteredValue)) {
        var enteredValue = parseInt($(this).val());
        if (enteredValue > maxValue) {
            $(this).val(maxValue);
        } else if (enteredValue < minValue) {
            $(this).val(minValue);
        }
    } else {
        $(this).val(minValue);
    }


});
Tobi
  • 23
  • 1
  • 5

2 Answers2

0

According to Can I Use dot com, form validation is currently poorly supported by Safari. By Safari on iOS not at all, even. And there is only partial support by Safari on non-tablets. See http://caniuse.com/form-validation.

Frank Conijn - Support Ukraine
  • 3,050
  • 1
  • 22
  • 29
  • Great Thanks!! I now added my suggestion. – Tobi Jul 05 '14 at 19:24
  • @Tobi: You're welcome. And FYI: there is more inconsistent form behavior among browsers, also among the new browser versions. Just [have a look here](http://stackoverflow.com/questions/24407109/new-webkits-convert-decimal-comma-to-dot-and-vice-versa-in-number-type-inputs), to see that new continental-European WebKit versions change decimal commas to dots for calculation purposes in math forms, and change decimal dots to commas for the math output field... So, you took the right decision to revert to Javascript validation. – Frank Conijn - Support Ukraine Jul 06 '14 at 05:04
0

if you still looking for the answer you can use input type="number".
min max ork if it set in that order: 1-name 2-maxlength 3-size 4-min 5-max just copy it

<input  name="X" maxlength="3" size="2" min="1" max="100" type="number" />
autodidact
  • 88
  • 1
  • 1
  • 7