www.webdeveloper.com
Results 1 to 3 of 3

Thread: JS & DOM problem.

  1. #1
    Join Date
    Mar 2009
    Posts
    2

    Exclamation JS & DOM problem.

    Hi guys,
    I've a problem. The following script works on FireFox, Google Chrome and IE8, but it seems it doesn't work on IE7...
    When the page loads, the username & password boxes are displayed. The username field says "username", and the password box says "password" (style text). When you click on the password field, I change the password field using DOM to one with style=password, so when the user types his password, it isn't displayed and it shows the *******.
    The problem is that on IE7, when you click on the Password box, the box gets moved to the right....
    I've tried but haven't found a solution for this, please help!! .

    Code:
    <script type="text/javascript">
    function switchto(q)
    {
        if (q)
        {
            document.getElementById('ln_auth_password_hdrtxt').style.display="none";
            document.getElementById('ln_auth_password_hdr').style.display="inline";
            document.getElementById('ln_auth_password_hdr').focus();
        }
        else
        {
            document.getElementById('ln_auth_password_hdr').style.display="none";
            document.getElementById('ln_auth_password_hdrtxt').style.display="inline";
        }
    }
    </script>
    And down...
    Code:
       $_username = (!empty($_POST['ln_auth_username'])) ? $_POST['ln_auth_username'] : 'username';
       $_password = (!empty($_POST['ln_auth_password'])) ? $_POST['ln_auth_password'] : '';
       
       if (!SAuthentication::is_auth()) echo <<<HOKA
        <div id="header_login_con">
         <form action="./login.php" method="post">
         <span class="hdr_ln_input"><input class="header_login_ipt" type="text" tabindex="1" value="{$_username}" maxlength="18" onblur="if (this.value == '') { this.value= 'username'; }" onfocus="if (this.value == 'username') { this.value= ''; }" name="ln_auth_username" /></span><span class="hdr_ln_right"><input class="header_login_sub" tabindex="3" type="submit" name="login_submit" value="login to account" /></span><br class="clear" />
         <span class="hdr_ln_input"><input class="header_login_ipt" type="text" tabindex="2" value="password" maxlength="18" id="ln_auth_password_hdrtxt" onclick="switchto(1)" onkeydown="switchto(1)" name="ln_auth_passwordtxt" /></span>
         <span class="hdr_ln_input"><input class="header_login_ipt" type="password" tabindex="3" value="{$_password}" maxlength="18" id="ln_auth_password_hdr" onblur="if (this.value=='')switchto(0)" style="display:none" name="ln_auth_password" /></span><span id="hdr_ln_rightbtm"><a href="./login.php?do=lostpw">forgot password?</a></span><br class="clear" />
         </form>
         </div>
         <br class="clear" />
        </div>

    Please, I really need help with this...

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    The length of the password box is shorter, it doesn't move to the right with the snippet you have given.
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Mar 2009
    Posts
    495
    Yeah--try putting a "size=18" instead of a maxlength attribute. It seems that this is more an html or CSS problem than anything else.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles