Gain access to input box elements?

[Migration User]

I am writing some workflows that are specifically geared towards iOS devices and there has been a request to use some of the iOS features, specifically custom keyboards. When you code a text box in HTML you can make the box have a specific type. iOS devices can take something with <input type="email"> and display a different keyboard layout with the @ on the main keyboard. Is there a way that I can gain access to be able to edit those elements on a webform so that I can use the custom keyboard types at all?

[Migration User]

You can use custom events to write your own javascript and access other components on your form

For example, you can add the following custom event to onload of your form

var textbox = document.getElementById('yadda');

textbox.value = "";

 

This assumes you've given a ControlID of "yadda" to a textbox element on the form.

[Migration User]

Either I'm not doing it right (very possible) or it isn't working for some other issue but I can't seem to change the type on the fly.

 

I have tried adding an onload() to the form like this:

      var textbox = document.getElementByID('email').type = "email";

with the text box element containing the ID of 'email'. I have even tried it using a Body onLoad() and an element onFocus() event as well with no luck.

[Migration User]

I'd put the javascript across 2 separate lines, like the above:

var textbox = document.getElementById('yadda');

textbox.value = "";

I've never used the a = b = c format for javascript, only in C#.

Usually I do things like this for clicking buttons and checking checkboxes (onclick events)

[Migration User]

 

well, I was missing a key part which would be to actually create the function and then call it on form the form event. I tried a few and for some reason only onFocus would work and it would only work if I went to the element the second time. I then used this function instead:

 

var runOnce = false;

function go()

{    

if(runOnce)

    return;

runOnce = true;    

var txt=document.getElementById("email");    

var txt2= txt.cloneNode(false);    

txt2.type='email';    

txt.parentNode.replaceChild(txt2,txt);}

 

which works (again only using onFocus) but will actually take the element off focus the first time you tap it so its not perfect but it does work. I tried the onLoad, onActivate, etc for both the form and the element and it isn't quite right. But I have the @ symbol on the main keyboard on the iPhone which is what I was asked for...