Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Very Simple AJAX question

    Hi Guys

    I have a very simple problem for you. I have a little ajax script which just checks a string's length in a form field and reports back how many characters are remaining. I would like to use this script on multiple fields so I want to be able to pass the max_string_length and response_field parameters through to the javascript. Here's the call:

    checkLength(this.value,'50','usplength')

    Here's the function line:

    function checkLength(text,length,output)

    and here's the response text line:

    document.getElementById(output).innerHTML=xmlHttp.responseText;

    Needless to say this isn't working but if I specify a field name in speech marks, it works fine. How do I get the passed variable "output" to be the field name which the script dumps to?

    Thanks
    Dan

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    My guess is that output is a variable local to the function checkLength().

    declare it outside the function,
    var output;

    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    So hopeful!

    Hi Phillip

    Thanks for that, I thought for a second that would be it! Sounded like prefect logic. Unfortunately it didn't work. Is there any chance you could check to see if my code is ok?

    var xmlHttp;
    var output;

    function checkLength(text,length,output)
    {

    xmlHttp=GetXmlHttpObject();
    if (xmlHttp==null)
    {
    alert ("Your browser does not support AJAX!");
    return;
    }

    var url="checkLength.php";
    url=url+"?text="+text;
    url=url+"&length="+length;
    url=url+"&sid="+Math.random();
    xmlHttp.onreadystatechange=stateChanged;
    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);
    }

    function stateChanged()
    {
    if (xmlHttp.readyState==4)
    {
    document.getElementById(output).innerHTML=xmlHttp.responseText;
    }
    }

    function GetXmlHttpObject()
    {
    var xmlHttp=null;
    try
    {
    // Firefox, Opera 8.0+, Safari
    xmlHttp=new XMLHttpRequest();
    }
    catch (e)
    {
    // Internet Explorer
    try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    }
    return xmlHttp;
    }


    Thanks
    Dan

  • #4
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    as Mr M has said ...
    the problem is the var output
    is local to the function
    checkLength. one solution
    is to make the function
    stateChanged
    also local to
    checkLength ...
    Code:
    <!doctype html>
    <head><title></title>
    <script>
    function checkLength(text,length,output){
    	xmlHttp=GetXmlHttpObject();
    	if (xmlHttp==null){
    		alert ("Your browser does not support AJAX!");
    		return;
    	} 
    	var url="checkLength.php";
    	url=url+"?text="+text;
    	url=url+"&length="+length;
    	url=url+"&sid="+Math.random();
    	xmlHttp.onreadystatechange=function stateChanged(){ 
    					if (xmlHttp.readyState==4){					
    					document.getElementById(output).innerHTML=xmlHttp.responseText;
    					}
    	}
    	xmlHttp.open("GET",url,true);
    	xmlHttp.send(null);
    } 
    function GetXmlHttpObject(){
    	var xmlHttp=null;
    	try{
    		// Firefox, Opera 8.0+, Safari
    		xmlHttp=new XMLHttpRequest();
    	}catch (e){
    		// Internet Explorer
    		try{
    			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    		}catch (e){
    			xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    		}
    	}
    	return xmlHttp;
    }
    
    </script></head><body>
    <button type="button" onclick="checkLength('text',50,'dsply')">clickme</button>
    <div id="dsply"></diV>
    </body></html>


  •  

    Posting Permissions

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