Solved

change a textfield into a password field by a button press

Posted on 2003-11-26
10
451 Views
Last Modified: 2012-08-14
hello is it possibe to change a input text field into a input password field with a button click?

Thanks,
Ferry
0
Comment
Question by:ferryl
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 2
  • 2
  • +1
10 Comments
 
LVL 10

Expert Comment

by:Nushi
ID: 9824140
change the type to:

type='password'

Nushi.
0
 
LVL 1

Author Comment

by:ferryl
ID: 9824159
I have try this: document.form.field.type='password'
but it don't work i get this error: Could not get the type property. This command is not supported.

Is there a other solution?
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9824179
<script>
function changeType( objId ){
      var src =  document.getElementById( objId );
      var type = 'password' ;
      
      //create the new object as a password field
      var input ='';
      input += '<input type=' + type + ' ';
      input += ' name=' + src.name + ' ';
      input += ' id=' + src.id + ' ';
      input += ' value=' + src.value + ' ';
      input += '><br>';
      
      document.getElementById('myField').innerHTML = input;
      }
</script>

<span id='myField'>
<input type='text' id='textField' value='password'><br>
</span>
<input type="button" onclick="changeType( 'textField' )">


Nushi
0
Instantly Create Instructional Tutorials

Contextual Guidance at the moment of need helps your employees adopt to new software or processes instantly. Boost knowledge retention and employee engagement step-by-step with one easy solution.

 
LVL 25

Accepted Solution

by:
devic earned 20 total points
ID: 9824203
try this:
==================================
<form name=myform>
<input name=textfield type=text value=devic>
</form>
<script>
function runit()
{
      document.myform.textfield.outerHTML="<input type=password name=textfieldsasa value="+document.myform.textfield.value+">"
}
</script>
<button onclick=runit()>runit()</button>
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9824207
devic

its the same code i wrote for him.

Nushi.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9824209
the concept is to create new element.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 9824220
Except Nushis code would work in Mozilla too which does not have support for outerHTML...
However would the form submit the content???
0
 
LVL 10

Expert Comment

by:Nushi
ID: 9824248
mplungjan
my guru see all as always

 :-))
0
 
LVL 1

Author Comment

by:ferryl
ID: 9824255
thank, but is it not possbile without the innerHTML?
0
 
LVL 25

Expert Comment

by:devic
ID: 9824607
@ Nushi,

you think that my code is same with your? ;)

@mplungjan, including mozilla, opera
ok here is another version:
=======================
<form name=myform>
<input name=textfield type=text value=devic>
<input name=other type=text value=devic>
</form>
<script>
function runit()
{
    formHTML =document.myform.innerHTML.split("<");
      for(var i=0;i<formHTML.length;i++)
      {
            if(formHTML[i].match(/textfield/))
            {
                  formHTML[i]="input name=textfield type=password value=devic>";
            }
      }
      document.myform.innerHTML=formHTML.join("<")
}
</script>
<button onclick=runit()>runit()</button>
======================================
@ferryl,
yes it possbile:
write manual new form ;)


0

Featured Post

Revamp Your Training Process

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

739 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question