Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

New to Javascript, adding variable to function

Status
Not open for further replies.
dr00bie

dr00bie

Programmer
Feb 19, 2004
108
US
I am very new to Javascript/AJAX, and have been fiddling around with it to make some new interfaces. I have the following js code that I swiped from w3schools.com,


Code: 
var xmlHttp

function showName(RegNo)
{
if (RegNo.length==0)
{ 
document.getElementById("txtHint").innerHTML=""
return
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}        
var url="db/cli/shared/getresidentname.asp"
url=url+"?RegNo="+RegNo
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
} 

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
   { 
   document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
   } 
} 

function GetXmlHttpObject()
{ 
var objXMLHttp=null
if (window.XMLHttpRequest)
  {
  objXMLHttp=new XMLHttpRequest()
  }
else if (window.ActiveXObject)
  {
  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
  }
return objXMLHttp
}

The body of my page looks like this,


Code: 
<body>
<form name="form1" id="form1"> 
First Name:
<input type="text" id="txt1" onBlur="showName(this.value)">
</form>
<p>First Name: <span id="txtName"></span></p>
</body>

I am trying to add another parameter to the function, so I can call the function using a different span element name. I have tried this,


Code: 
var xmlHttp

function showName(RegNo,ctlName)
{
if (RegNo.length==0)
{ 
document.getElementById(ctlName).innerHTML=""
return
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}        
var url="db/cli/shared/getresidentname.asp"
url=url+"?RegNo="+RegNo
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged(ctlName)
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
} 

function stateChanged(ctlName) 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
   { 
   document.getElementById(ctlName).innerHTML=xmlHttp.responseText 
   } 
} 

function GetXmlHttpObject()
{ 
var objXMLHttp=null
if (window.XMLHttpRequest)
  {
  objXMLHttp=new XMLHttpRequest()
  }
else if (window.ActiveXObject)
  {
  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
  }
return objXMLHttp
}

the body code looks like this,


Code: 
<body>
<form name="form1" id="form1"> 
First Name:
<input type="text" id="txt1" onBlur="showName(this.value,txtName1)">
</form>
<p>First Name: <span id="txtName1"></span></p>
</body>

But I get a "Type Mismatch" error on the,


Code: 
xmlHttp.onreadystatechange=stateChanged(ctlName)

line. I am not sure where I am going wrong, but as I said I am very new to javascript/AJAX. Anyone know what I should do?

Thanks,
Drew
 
Sort by date Sort by votes
You are passing in an instance of txtName1 instead of the name "txtName1" to the getElementById() function. You are getting a "Type Mismatch" error because that function is expecting a string, but receiving an object.

Try changing this line:
Code: 
<input type="text" id="txt1" onBlur="showName(this.value,[b]'txtName1'[/b])">

Adam
 
Upvote 0 Downvote
Thanks for the reply Adam, I edited the code, but it is still popping a Type Mismatch error on the same line.

Thanks,
Drew
 
Upvote 0 Downvote
The other problem I see is this line:
Code: 
xmlHttp.onreadystatechange=stateChanged(ctlName)
You are passing the results of the stateChanged function to onreadystatechange which is expecting a function. Try changing ctlName to be a global variable instead of an argument of the stateChanged function, then change the line to read:
Code: 
xmlHttp.onreadystatechange=stateChanged;

Adam
 
Upvote 0 Downvote
Actually, I was just about to post my fixed code, thanks for the recent reply though.

Code: 
function showName(RegNo,ctlName){
     if (RegNo.length==0){ 
          document.getElementById(ctlName).innerHTML=""
          return
     }
     var xmlHttp = GetXmlHttpObject();
     var url = "db/cli/shared/AJAX_getresidentname.asp";
     url += "?RegNo="+RegNo;
     url += "&sid="+Math.random();
     
     if (!xmlHttp){
          alert ("Browser does not support HTTP Request")
          return
     }
     xmlHttp.onreadystatechange=function(){
     if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
            document.getElementById(ctlName).innerHTML=xmlHttp.responseText;
        }
     };
     xmlHttp.open("GET", url, true);
     xmlHttp.send(null);
}

function GetXmlHttpObject(){ 
var objXMLHttp=null;

     if (window.XMLHttpRequest){
          objXMLHttp=new XMLHttpRequest();
     }else if (window.ActiveXObject){
          objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP");
     }
     return objXMLHttp;
}

And I call this code by,

Code: 
<input type="text" id="txt1" onBlur="showName(this.value,'txtHint')">

Thanks for the replies!
Drew
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
632
lexer
lexer
Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
1K
Mike Lewis
Mike Lewis
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
760
Kennelbloke
Kennelbloke
JScannell
  • Locked
  • Question
Javascript events
Replies
1
Views
257
Daniel K
Daniel K
JScannell
  • Locked
  • Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
620
JScannell
JScannell

Part and Inventory Search

Sponsor

Back
Top