Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts

    jQuery select password input box

    I have a password input box:

    Code:
    <input type="password" class="text hidden_pass" value="Password" title="Password" name="pass" />
    the javascript file that loads has this command which loads when the page loads
    Code:
    // focus password file if we routed through the purchase confirmation
    curfile=location.href;
    purch_check=curfile.indexOf('purchase-confirmation');
    if (purch_check>-1){
    $(".text hidden_pass").focus();
    }
    This is not showing the password dots when the page loads. When I click the input box manually after the page loads, you see the dots. I want the user to see those automatically without having to cllick.

    purch_check is coming back as 44 when the page loads, so that if statement is firing.

    the password field is in a file called header.js and the main page is purchase confirm.html.
    Last edited by mathceleb; 05-16-2011 at 04:55 PM.

  • #2
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Code:
    // focus password file if we routed through the purchase confirmation
    curfile=location.href;
    purch_check=curfile.indexOf('purchase-confirmation');
    if (purch_check>-1){
    $(".text .hidden_pass").focus();
    }
    from the way you use in html hidden_pass is class too.

    best regards

  • #3
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts
    that did not work. But you mention other classes, here is the entire page code:

    Code:
    		<li class="login">
    			<div class="login-box">
    				<form name="login-form" id="login-form" method="post">
    					<input type="text" class="text click-clear" value="<?= (strlen($username)>0) ? $username : 'Username' ?>" title="Username" name="uname" /> 
    					<input type="text" class="text fake_pass" value="Password" title="Password" name="fake_pass" />
    					<input type="password" class="text hidden_pass" value="<?= (strlen($pass)>0) ? $pass : '' ?>" title="Password" name="pass" />
    					<a class="button right"><span name="login">Login</span></a>
    					<div class="clearfix"></div>
    					<div class="links">
    						<input type="checkbox" name="remember" value="1" /> 
    						<label style="margin-right:13px;">Remember me</label> 
    						<a href="?page=forgot">Forgot your Password?</a>
    					</div>
    				</form>
    			</div>
    		</li>

  • #4
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by mathceleb View Post
    that did not work. But you mention other classes, here is the entire page code:
    what i said was that the class selector in jquery is dot, ., without dot jquery will look for an element not a css class.

    best regards

  • #5
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts
    The class selector in that case was the text hidden_pass. Do I need to add the parent class?

  • #6
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by mathceleb View Post
    The class selector in that case was the text hidden_pass. Do I need to add the parent class?
    what do you mean by this? 'text hidden_pass' is a single css class? can't be because space is not allowed in class name but is ok if you have two classes, text first and hidden_pass second. In this last case you need to use the proper selector of the class which is ".hidden_pass" with a dot in front.

    Edit: no, you don't need the parent class

    best regards

  • #7
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts
    I have even try using $(":text").focus(); for all input text boxes, and that did not work either. It still requires a manual click.

  • #8
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by mathceleb View Post
    I have even try using $(":text").focus(); for all input text boxes, and that did not work either. It still requires a manual click.
    your password input is type="password" not type="text" and you can't focus more then one input in the same time:
    Code:
    	<form name="login-form" id="login-form" method="post">
    		<input type="text" class="text click-clear" value="<?= (strlen($username)>0) ? $username : 'Username' ?>" title="Username" name="uname" /> 
    		<input type="text" class="text fake_pass" value="Password" title="Password" name="fake_pass" />
    if you want to go this route try:
    Code:
    $(":password")
    but must be a single one in the page.

    best regards
    Last edited by oesxyl; 05-16-2011 at 07:00 PM. Reason: removed irelevant question

  • #9
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts
    I tried the password option as well and this did not work.

  • #10
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by mathceleb View Post
    I tried the password option as well and this did not work.
    try to post a link to the page.

    best regards

  • #11
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts
    I finally got this to work. I setup a fake password box that is hidden, and toggled the values using jQuery, so that the real password box would be loaded with the fake value, and that way, it would focus.

    Code:
    // focus password file if we routed through the purchase confirmation so that it shows the dots and not the word "Password"
    curfile=location.href;
    purch_check=curfile.indexOf('purchase-confirmation');
    if (purch_check>-1){
    $(':password').show();
    $("input[name=fake_pass]").toggle();
    }


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •