Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

Password Input Element Not Getting Focus

align element

  • Please log in to reply
3 replies to this topic

#1 Blue Indian

Blue Indian

    CC Resident

  • Advanced Member
  • PipPipPipPip
  • 61 posts

Posted 07 March 2012 - 05:35 AM

I have my question and the import parts of the code highlighted in red.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/URL]">
<html xmlns="[url=http://www.w3.org/1999/xhtml]XHTML namespace[/url]">
<head>
    //removed lots of stuff, so ignore if missing div tag or something like that
</head>
[COLOR=#FF0000]//Why does the only only password input element with an id="Password" not get the focus here?
//Does it have to do with the fact that there are two password input elements on this page?
//If so, what is the answer?
[/COLOR]<body  [COLOR=#FF0000]onload=document.getElementById('Password').focus();>[/COLOR]
<div id="header">
<div class="login-box">
  <div class="tab">Sign In</div>
  <form>
    <label for="email">Email Address</label>
    <input type="email" name="email">
    <label for="password">Password</label>
    [COLOR=#FF0000]<input type="password" name="password"> //Keep looking there in another input element with id="Password"
[/COLOR]    <input type="submit" value="Sign In">
    <a href="#" class="forgot-password">Forgot Password</a>
    <div class="clear"> </div>
  </form>
</div>
<div id="main">
 <h1>
  Sign In
 </h1>
<form action="/" method="post"><div class="validation-summary-valid" data-valmsg-summary="true"><ul><li style="display:none"></li>
</ul></div><input id="RequestParam" name="RequestParam" type="hidden" value="" />                    
 <table>
  <tr>
   <td align="right">
    <label class="req">Email Address</label>
   </td>
   <td>
    <input data-val="true" data-val-required="Email Address is required" id="EmailAddress" name="EmailAddress" style="width:170px;" type="text" value="[EMAIL="rharrison@kahua.com"]rharrison@kahua.com[/EMAIL]" />
    <span class="field-validation-valid" data-valmsg-for="EmailAddress" data-valmsg-replace="true"></span>
   </td>
  </tr>
  <tr>
   <td align="right">
    <label class="req">Password</label>
   </td>
   <td>
      [COLOR=#FF0000]//Why is this element not getting the focus?[/COLOR]
    [COLOR=#FF0000]<input data-val="true" data-val-required="Password is required" id="Password" name="Password" onkeypress="capLock(event);" style="width:170px;" type="password" />
[/COLOR]    <span class="field-validation-valid" data-valmsg-for="Password" data-valmsg-replace="true"></span>
    <div id="divCapsWarning" style="visibility:hidden;display:inline;color:red;font-weight:bold;">Caps Lock On</div>
   </td>
  </tr>
  <tr>
   <td align ="right" colspan="2">
     <a href="[URL]http://localhost:3104/Product/ForgotPassword">Forgot[/URL] Password</a>
   </td>
  </tr>
  <tr>
   <td align="right">
    <label class="req">Remember me</label>
   </td>
   <td>
    <input checked="checked" data-val="true" data-val-required="The RememberMe field is required." id="RememberMe" name="RememberMe" type="checkbox" value="true" /><input name="RememberMe" type="hidden" value="false" />
   </td>
  </tr>                        
  <tr><td colspan="2" style="height:10px;"></td></tr>
  <tr>
   <td align="right">
    <label class="req">Use New Host</label>
   </td>
   <td>
    <input data-val="true" data-val-required="The UseNewHost field is required." id="UseNewHost" name="UseNewHost" onchange="setUseNewHost();" type="checkbox" value="true" /><input name="UseNewHost" type="hidden" value="false" />
   </td>
  </tr>
 </table>
                    <input type="submit" id="submit" value="Sign In ยป " />
</form>
</div>
</div>
</body>
</html>


  • 0

#2 wim DC

wim DC

    Roar

  • Expert Member
  • PipPipPipPipPipPipPipPip
  • 2681 posts
  • Programming Language:Java, JavaScript, PL/SQL
  • Learning:Python

Posted 07 March 2012 - 06:43 AM

Works fine for me in chrome and firefox.

Edit: Also works in IE 8
  • 0

#3 Blue Indian

Blue Indian

    CC Resident

  • Advanced Member
  • PipPipPipPip
  • 61 posts

Posted 09 March 2012 - 01:16 PM

Man, this is killing me. I can't get this to work IE9 without using compatibility view. Does anyone know how to get the focus working in IE9 with multiple forms?
  • 0

#4 wim DC

wim DC

    Roar

  • Expert Member
  • PipPipPipPipPipPipPipPip
  • 2681 posts
  • Programming Language:Java, JavaScript, PL/SQL
  • Learning:Python

Posted 09 March 2012 - 01:20 PM

This may sound odd, but try doing .focus() twice in a row.
  • 0





Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download