Question

New to jquery so it is possible I've missed a vital element somewhere along the lines. I've been digging for the past couple of hours and have tried several solutions but nothing I've tried solves the delima. All I'm trying to do is execute some code once "textboxUsername" loses focus. In straight javascript I used to do this by adding an onblur() event to the specific input element and call a function. Any advice appreciated...

HTML:

<div>
<div class="heading">
    <span class="inside_heading">Register</span>
</div>
<div class="content_under_heading">
    <div class="rounded_div">
        <ul class="ulRegister">
            <li class="descLabel">
                Username:
            </li>
            <li class="inputInfo">
                <input type="text" id="textboxUsername"/>
            </li>
            <li class="successCheck" id="usernameSuccessCheck">
                <img id="usernameCheckImage" src="templates/images/check.png" class="noShow"/>
                <img id="usernameXImage" src="templates/images/check.png" class="noShow"/>
            </li>
        </ul>

        <label id="labelUsernameExists" class="registerIssue"></label>

    </div>
</div>
</div>

JavaScript

$(document).ready(function(){
//textboxUsername blur event
$("#textboxUsername").blur(function(){
    var possibleUsername = $("#textboxUsername").val();
    if(possibleUsername.length != 0){
        if(possibleUsername.length < 6){
            //display message
            var message = "Usernames must be at least 6 characters";
            $("#labelUsernameExists").text(message);
        } else{
            //ajax
        }
    }
});
});
Was it helpful?

Solution

The issue wound up being quite novice. It turns out that I had previously used the id of "textboxUsername" on an element in an overlay div that was being added to the page dynamically. The code posted is functional since it was abstracted out of the main application. Thank you to pdoherty926 and dystroy for pointing that out ultimately leading me in the right direction!

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top