How to set up a "sticky" email or tel type field in Freeform Pro

Question

I'm using Freeform Pro, and I'd like to keep the fields mobile friendly. So an email field should be an email type, a phone field should be a tel type, etc.

However, Freeform Pro doesn't have the option for an email or tel type field - even if selected as text/email in the admin, it still outputs it as a plain text field.

If I just create the field without freeform tags, it of course is not going to be "sticky" - and that is a problem too.

I also tried using the tag pairs to make the field sticky (that works), but it just converts my email type to text in the html output.

In my template:

{freeform:field:email} <input id="freeform_email" name="email" type="email" value="{freeform:data:value}"> {/freeform:field:email}

The html output:

<input type="text" name="email" value="" id="freeform_email" maxlength="150" />

UPDATE:

I've also tried with php (unsuccessful at making it sticky):

<input 
 id="freeform_email" name="email" type="email" 
 value="<?php if(isset($_SESSION['email'])) echo $_SESSION['email'];?>"
 >

Any ideas on how to make a custom type field like this be sticky in Freeform Pro?

Note: "sticky" means that the form will hold the field values if say there is an error, on page reload the data will remain. Otherwise, it takes the user back to a blank form and they would have to fill out it all over again.

Answer 1

This seems like a front-end thing, but I kind of have no idea what a sticky is. Try this:

Make a sticky field output on your form. Use your developer console (F12 on Windows with Chrome or Firefox), and investigate the sticky input. I'm going to bet it has a sticky class, something like:

<input id="whatever" class="whatever whatever-sticky">

So whatever the sticky class is, add it to your manual input field.