Change type in a form

[yojonasdk]

Is it possible in any ways to change the type for a field in the form generator without write it all in custom html?

I wan't my input type beeing "tel" instead of "text". The problem is, when you write the whole code in a custom html, it will not success when you are sending the form. So any extensions or tips and tricks?

[thedotwriter]

Hi,

Isn't it much more simpler to create a text field with an input validation set to "phone number" ?

If it fits your needs it could be better than hack the core to add an input type.

Regards.

[yojonasdk]

Hi,

Nope, it dosen't work when I set the validation to phone number. The type will still be text, and not tel as I want it to be :cry:

[xchs]

What means type "tel"? Do you want a form element for a phone number? If so, just choose a form element of type "Text field" and switch the "Input validation" to "Phone number".

[Ruud]

Perhaps not the best site to refer to, but tel is one of the new html5 input field types: http://www.w3schools.com/html5/html5_fo ... _types.asp They where designed using the default behavior that an input element has when a unknown type was chosen: fallback onto "text". So using a tel type will add functionality on HTML5 enabled browsers, but do nothing on others and show a normal form.

Anyway, for the time being you'd have to create a widget that accepts a type selection, based upon the FormTextField class. It could even just replace the existing class (defaulting to text/password) and by extending the tl_form_field dca a new field could be added there to select the type. I might have a go at it either tomorrow or in the weekend, my first impression is this isn't that hard at all and it would add something Contao is lacking in HTML5 support.

[Ruud]

I quickly made an extension to do what you need: www.contao.org/en/extension-list/view/html5_input.html Can you test it working for you? I haven't tested it very well yet, but the output seems to work as expected. All fields will fall back to 'text' when the output format is xhtml. The range and number fields have the attributes min, max and step.

Any input and suggestions are welcome!

[yojonasdk]

Hi Ruud,

Thanks a lot! It was exactly, what I was looking for. The type are changing just the way I wanted it to :D

I don't hope you had 'lot of troubles by making the extension - I am really appreciate it!

[Ruud]

I've updated the extension. It now also includes date format for min and max, min, max and step for date type and multiple for email type.

Let me know if there are any issues.