New form features in HTML5

Forums » Dev.Opera » Archived Article Discussions

This topic has been closed. No new entries allowed.

Reason: You can now post comments on articles on Dev Opera

Forum rules and guidelines

You need to be logged in to post in the forums. If you do not have an account, please sign up first.

Go to last post

16. December 2010, 16:15:53

Moderator

patrickhlauke

Posts: 29

New form features in HTML5

HTML5 includes many new features to make web forms a lot easier to write, and a lot more powerful and consistent across the Web. This article gives a brief overview of some of the new form controls and functionalities that have been introduced.

( Read the article )

16. December 2010, 18:31:22

POWRSURG

Posts: 18

I absolutely love the datalist tag. I cannot wait until it is supported by more browsers, or until someone can come up with a script to add support for browsers that do not have it. I tried it myself one afternoon and did not have much success. Seems like a great nicety.

16. December 2010, 20:52:02

toscho

Posts: 147

How do we style the placeholder?

17. December 2010, 08:50:25

SailorMax

Posts: 520

Can we use calendar without input field?

And why input fields like "number" or fields with patterns allow enter wrong symbol? May be better restrict enter wrong symbols while user enter them, but not on submit? What say about it standard?

17. December 2010, 14:49:22

brucelawson

Posts: 52

Toscho - you can't style the placeholder at the moment. We're looking at how that can be accomplished; currently there is nothing in CSS that gives a hook to style.

SailorMax - the calendar is only for inputting dates. And validation only takes place at submit time. The standard is silent about User Interface.

17. December 2010, 15:42:11 (edited)

BS-Harou

Posts: 226

There is the same redraw bug with Datalist like there was with select element.

1) Create Datalist with enough items to scroll
2) Scroll with mousewheel
3) Black rectangle appears at the bottom of datalist.

Also, it's not possible to clear value of datetime or datetime-local input type with javascript.

(DSK-321840, DSK-299031)

21. December 2010, 14:37:09

brucelawson

Posts: 52

Thanks BS-Harou. Have noted those for fixing.

31. December 2010, 20:02:29

lccb2011

Posts: 1

I am developing a form using elements from HTML5 and CSS.

Only Chrome 8.0 displayed placeholder (although all other browsers degraded gracefully)
Luis Cavalcanti Bahiana
CSS & HTML Developer

4. January 2011, 12:22:22

Opera Software

chrismills

Posts: 379

Originally posted by lccb2011:

Only Chrome 8.0 displayed placeholder (although all other browsers degraded gracefully)



placeholder should also work in Opera 11. It does on my Mac.
Chris Mills
Developer Relations Manager
Editor, dev.opera.com and labs.opera.com

14. March 2011, 14:40:19

Ambigata

Posts: 3

Why user can't clear the date field ?

28. March 2011, 13:40:20

Opera Software

chrismills

Posts: 379

Originally posted by Ambigata:

Why user can't clear the date field ?



Oh, you mean as in, why can't you clear the value inside <input type=date> again, after adding one in? Interesting point. I mean, I can't think of that many reasons why you'd want to not input a date after inputting one, but yeah, you might want to...
Chris Mills
Developer Relations Manager
Editor, dev.opera.com and labs.opera.com

12. April 2011, 09:37:17

Ambigata

Posts: 3

Originally posted by chrismills:

Originally posted by Ambigata:

Why user can't clear the date field ?



Oh, you mean as in, why can't you clear the value inside <input type=date> again, after adding one in? Interesting point. I mean, I can't think of that many reasons why you'd want to not input a date after inputting one, but yeah, you might want to...



It was possible with opera 10.6, you can see a 'none' button in lot of screen about this feature.
I used that in a 'filtering form', so since 11.* users can't no more change search.

12. April 2011, 15:30:41

Opera Software

chrismills

Posts: 379

Originally posted by Ambigata:

It was possible with opera 10.6, you can see a 'none' button in lot of screen about this feature.I used that in a 'filtering form', so since 11.* users can't no more change search.



I have asked the developers about this for you, as I'm interested to know the answer myself!
Chris Mills
Developer Relations Manager
Editor, dev.opera.com and labs.opera.com

4. May 2011, 18:38:35

bgresort

Posts: 1

i think most browsers does not support HTML 5 yet

10. June 2011, 07:09:04

toscho

Posts: 147

@brucelawson Any progress on styling placeholders?

10. June 2011, 08:28:28

Opera Software

chrismills

Posts: 379

Originally posted by toscho:

@brucelawson Any progress on styling placeholders?



Not yet - there are a few experimental proposals on how to do this kind of thing, but nothing concrete yet.
Chris Mills
Developer Relations Manager
Editor, dev.opera.com and labs.opera.com

11. June 2011, 12:10:44

toscho

Posts: 147

Originally posted by chrismills:


Not yet - there are a few experimental proposals on how to do this kind of thing, but nothing concrete yet.



I have compared Mozilla’s and Webkit’s implementations during my research for an article (still unfinished). I think a pseudo class (like in Mozilla) is the better way because it fills the whole field regardless of padding or border-radius. And it feels more consistent with :empty.

color, background-color and font-style are necessary from an accessibility perspective, everything else is not so important.

If I can help with test cases or just brainstorming, drop me a mail. I would really like to see placeholders more accessible.

13. June 2011, 14:34:00

Opera Software

chrismills

Posts: 379

Originally posted by toscho:

I have compared Mozilla’s and Webkit’s implementations during my research for an article (still unfinished). I think a pseudo class (like in Mozilla) is the better way because it fills the whole field regardless of padding or border-radius. And it feels more consistent with :empty.color, background-color and font-style are necessary from an accessibility perspective, everything else is not so important.If I can help with test cases or just brainstorming, drop me a mail. I would really like to see placeholders more accessible.



thanks for the ideas - I agree with you on this. Peter Gasston also wrote a really good article discussing proopsals for making error messages stylable/customizable: http://www.broken-links.com/2011/03/28/html5-form-validation/

Something like this would probably work well.
Chris Mills
Developer Relations Manager
Editor, dev.opera.com and labs.opera.com

Forums » Dev.Opera » Archived Article Discussions