I've been having trouble with a seemingly simple function...I have a form where 3 of 5 field values are generated by a script tied in with Google Search (like a business address). The user is prompted to enter their business license #, and as soon as the input field has val().length == 9 characters, I want to execute an ajax call among some other functions...

The problem is the function works when there are 9 characters in the field, but only after I generate a new and different set of values for the generated fields (i.e. the first generated values, coupled with those 9 characters isn't enough to set off the function, although when i use a second set of generated values, the function kicks in).

Here's the applicable code...although there's a lot more to the picture...

// when the business licence text field is focused (should be 9 characters long)
$('#ubi').focus(
     function() {
          var ubiVal = $('#ubi').val();
     
     if(ubiVal.length == 9) {	
	
        //Set some values I'll need for my ajax call...
        var bnameVar = $("#title").val();
	var ubiVar = $("#ubi").val();
		
        //hide Google search results w/ form-value generator buttons...
	$('#searchResults').toggle(false);
        
        //This is the div I want to show once #ubi is 9 characters...
	$('#verified').toggle(true);
        //Loading...
	$('#verified').append("<div id='ajaxBusy'><img src='images/addmapp_loading.gif' class='loadingText' /><h3 class='loadingText'>Searching business records...</h3></div>");
        
        //Loading display...
	$('#ajaxBusy').css({
		display:"none",
		margin:"3px",
		paddingTop:"0px",
		paddingBottom:"0px",
		position:"absolute",
		width:"auto"
	});

        //Loading text display...
	$('#loadingText').css({
		display:"inline",
		position:"absolute",
		top:"7px",
		left:"40px",
	});
	
        //Use 9-digit number from #ubi to perform my ajax function & handle results...
	$.getJSON("addmapp_sandbox/tim/scraper/readdol.php?ubi=" + 
		ubiVar + "&name=" + 
		bnameVar + "", 
		function(data){
			var ubi = data.ubi
		ubi = ubi.substring(0,9);
		$("#verified").html("<h3 class='loadingText'>" + 
				data.firmName + "</h3><h4>" + 
				ubi + " </h4><h4>" + 
				data.isMatch + "</h4><h4>"+ 
				data.locationAddress+"</h4>"
				);
		});
} // End if
} // End function()
); //End ('#ubi').focus()

It should work like: User types a business name into a text input, google search results asynchronously begin to appear as the user types, user finds said business within a set of results, clicks 'this is me', certain google results are appended to the form, THEN *** the user inputs a ubi number and the moment they type the 9th digit the rest of the function takes place...***

I would really appreciate the help, if even just a prod in the right direction. Thanks in advance!

Ha, nevermind, I have a strong suspicion I'm just outta my mind.

I answered my own question.

The functions won't work properly because the field is already in focus when i type the 9 digits in, so I have to blur (click out of) the field and then refocus (click back into) the field for the if statement to be iterated over again and the code to realize that now there are 9 digits within the field upon focus.

Whew.

There is hope yet.

Cheers! And thanks for considering to help me out..if you did.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.