HTML 5 input types

Thanks Matti. DoubleField was just the thing I needed. Safari on IOS works great. You can’t type illegal double values with it. But on anroid and desktop browsers (Chrome and Firefox) I am able to type invalid double values like 54,44 or 343,54,54,54.

Forgive my ignorance, Is this behaviour from the browsers and unavoidable or can anything be done from Vaadin side?

Thanks again

Hi,

There sure might be a change to fill in some illegal characters in some cases, but the actual value will then become null.

Can you let me know what OS/device you tried? I tested the thing in Mac and Win7 with all major browsers and I couldn’t fill in multiple decimal separators. The JS hook should prevent those.

cheers,
matti

Just tested with a colleagues Android, with that it seems it is possible to add multiple dots. The JS hook probably don’t work there so I don’t know what else we could do there. With server side validator you can naturally give a helpful error message.

Ok Matti, thanks again for the DoubleField.

I use a line of Javascript as work-around: https://gist.github.com/vonloxley/702ebe0a559d09d04fef7b03ac6b9966

Input event is but less optimal as the character might flicker on the screen, but additional input event listener based validation might be a good addition to better support Android Chrome. It’d be great if somebody with an Android device would contribute something for Viritin :wink:

I was unaware of this method with JavaScript.eval. Thanks. I’ll look into it.

Yes, the input type should definitely be “number”, that’s what Viritin number fields to as well, but that don’t prevent users to type in basic characters on most platforms. On desktop it does nothing (or adds small +/- buttons), on touch devices it selects number keyboard.

The relevant part is: “idHNR.type = ‘number’;”. The input-listener is an optimization for Firefox (LTS), which tends to allow chars in number-fields.

Nice HTML5, it’s better if you guys use it lead on website.


ธรรมะ


ข่าวภาพยนตร์