SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,424
    Mentioned
    2 Post(s)
    Tagged
    1 Thread(s)

    Not working in IE

    I have (what I thought was) a simple little JavaScript snippet that changes the <label> of an <input> field from bold to normal upon the entry of text in the <input> field. The code below functions in FF but not in IE. Any ideas why? And, if so, how this script can be made x-browser?

    Code:
    function changeLabel(ele) {
        var labels = document.getElementsByTagName("label");
        for (var i=0; i < labels.length; i++) {
            var label = labels[i];
            if (label.getAttribute("for") == ele.name)
                label.style.fontWeight = "normal";
        }
    }
    
    function validateField(ele) {
        ele.value = trim(ele.value);
        if (ele.value != ele.defaultValue && ele.value != '')
            changeLabel(ele);
    }
    
    function trim(inputString) {
        if (typeof inputString != "string")
            return inputString;
        var retValue = inputString;
        var ch = retValue.substring(0, 1);
        while (ch == " ") {
            retValue = retValue.substring(1, retValue.length);
            ch = retValue.substring(0, 1);
        }
        ch = retValue.substring(retValue.length - 1, retValue.length);
        while (ch == " ") {
            retValue = retValue.substring(0, retValue.length - 1);
            ch = retValue.substring(retValue.length - 1, retValue.length);
        }
        return retValue;
    }

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can you put your function in the minimum amount of html that exhibits the problem?

  3. #3
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,424
    Mentioned
    2 Post(s)
    Tagged
    1 Thread(s)
    Here's the form that contains the fields and labels. You can see the call to validateField() in the onchange event handler:

    Code:
    <form action="/signup.php" method="post" id="signup">
        <fieldset>
        <legend>Login Information</legend>
            <label for="name" class="required">Username</label>
            <input type="text" name="name" id="name" onchange="validateField(this)" />
            <br />
            <label for="passwd" class="required">Password</label>
            <input type="password" name="passwd" id="passwd" onchange="validateField(this)" />
            <br />
            <label for="password2" class="required">Confirm Password</label>
            <input type="password" name="password2" id="password2" onchange="validateField(this)" />
        </fieldset>
        <fieldset>
        <legend>User Information</legend>
            <label for="fullname" class="required">Full Name</label>
            <input type="text" name="fullname" id="fullname" onchange="validateField(this)" />
            <br />
            <label for="email" class="required">Email</label>
            <input type="text" name="email" id="email" onchange="validateField(this)" />
            <br />
        </fieldset>
        <p class="form">
            <input type="submit" name="submit" value="Submit" /> <input type="reset" name="reset" value="Reset" />
        </p>
    </form>
    Here's the webpage this is from: http://spf.johnconde.net/signup.php

    BTW, I actually got my hands on a copy of Safari and it works there, too.

  4. #4
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It works the same in IE and FF for me: nothing happens onchange.

  5. #5
    SitePoint Addict
    Join Date
    May 2004
    Location
    Europe
    Posts
    216
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    getAttribute is sometimes buggy in IE. Replace
    if (label.getAttribute("for") == ele.name)
    with
    if (label.htmlFor == ele.name)

  6. #6
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,424
    Mentioned
    2 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Saturn
    getAttribute is sometimes buggy in IE. Replace
    if (label.getAttribute("for") == ele.name)
    with
    if (label.htmlFor == ele.name)
    That worked. Unfortunately now IE doesn't want to reset properly and I cannot figure out why. I think I may just chalk this up as one of those extra features that enhance other browsers and doesn't affect IE users.

  7. #7
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,424
    Mentioned
    2 Post(s)
    Tagged
    1 Thread(s)
    Nevermind. It just could me changing window.onreset. I just called it explicitly.


Bookmarks

Posting Permissions

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