What error here

[shivkumar]

I just created a http://jsfiddle.net/L3TtU/2/ here I can’t make like this;

If click (button-show password) then show text box for password instead the place of username and hide (button-hide password) how?

[m3g4p0p]

Your markup doesn’t really allow that; but if you put the toggle buttons next to the associated input elements, you can .toggle() their container elements… like e.g.

HTML

<label class="toggle-container username">
  Username
  <input type="text" name="username">
  <button class="toggle-button">Show password</button>
</label>

<label class="toggle-container password">
  Password
  <input type="text" name="password">
  <button class="toggle-button">Hide password</button>
</label>

CSS

.password {
  display: none;
}

JS

var container = $('.toggle-container')

$('.toggle-button').click(function (event) {
  event.preventDefault()
  container.toggle()
})

[shivkumar]

You said this not possible.
First of all thanks fir reply…
But is it possible to show other button instead of hide button.
Structure:
[UserName] [show password-button]
[password] [submit. Button]

[shivkumar]

But thanks I can do this…
Thank you once again…

[shivkumar]

@m3g4p0p I am on your code but why textarea is not showing?

<style>.step2 {
  display: none;
}</style>

<form>

<label class="toggle-container step1">
 First Name
<input type="text" name="first_name" required>

 
Email 
<input type="email" name="email_address">

<button class="toggle-button">Next</button>
 </Form>

<label class="toggle-container step2">
 
<textarea name="comments" maxlength="500"></textarea><br>
<button class="toggle-button">Hide details</button>
</label>

<script>var container = $('.toggle-container') 

$('.toggle-button').click(function (event) {
  event.preventDefault()
  container.toggle() 
})</script>
</form>

Also when I adding the textbox in table form also then it is not working…

The main thing is in table not working …No problem…
But why it is not working when I not using anything?

[chrisofarabia]

The W3C validator is showing multiple markup errors in that snippet. You’ll need to resolve those before you can make any further progress.