Whats up with Hatim!

Changing HTML Input's type on runtime through Javascript/DOM

Posted by hatim Fri, 11 Jan 2008 09:17:00 GMT

This code is not working right now

I didn't know this trick my self, but yesterday I figured it out with (some googling ofcourse)

Consider the following input field, look how it changes its type from normal input field to type "file". [have to post javascript here]

Normally what people do is to make a hidden input field of type. But with help of some easy to use JavaScript one could change the attributes of document elements.

The following code should be helpful as an example

function toggle()
{
        //if our_input type is text make it type file
        if(document.getElementById('our_input').getAttribute('type') == 'text'){
                document.getElementById('our_input').setAttribute('type', 'file');
        }else{  //otherwise make it type text
                document.getElementById('our_input').setAttribute('type', 'text');
        }
}