Question

I seem to be having an issue with JQUERY.

I have an onclick event that calls a dialog box to open.
On opening the dialog box it calls two functions both Jquery requests.

Both functions send out a member ID and both return the required information however only one of the requests displays in the div that it is meant to.

This is the dialog box that calls the two functions…

$("#memberInfo").dialog({
        open: function() {
            getUserCourseInfo(memberid); 
            getUserInfo(memberid); },
        autoOpen: false,
        height: 750,
        width: 610,
        modal: true,
        title: 'Member Information',
        buttons: {
            Close: function() {$(this).dialog( "close" );}},
        close: function() {
            document.getElementById("memberInfoInner").innerHTML="Please Wait...";}
        }); 

This is the first function…

function getUserInfo(str) //Show the individual user
{
document.getElementById("memberInfoInner").innerHTML="";
if (str=="")
  {
    document.getElementById("memberInfoInner").innerHTML="";
    return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("memberInfoInner").innerHTML=xmlhttp.responseText;
        }
      }
xmlhttp.open("POST","getUser.php");
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("q="+ str);
}

This is the second function…

function getUserCourseInfo(str1)
{
document.getElementById("Courses").innerHTML="";
if (str1=="")
  {
    document.getElementById("Courses").innerHTML="";
    return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp1=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
    xmlhtt1p=new ActiveXObject("Microsoft.XMLHTTP");
  }
    xmlhttp1.onreadystatechange=function()
      {
      if (xmlhttp1.readyState==4 && xmlhttp1.status==200)
        {
        document.getElementById("Courses").innerHTML=xmlhttp1.responseText;
        }
      }
xmlhttp.open("POST","getUserCourseInfo.php");
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("q="+ str1);
}

The div is defined correctly later on in the code.
Any help anyone can give would be great.

Thanks

Richard

Answer 1

I’m going to take a stab in the dark, and say that this might be your problem:

function getUserCourseInfo(str1)
{
document.getElementById("Courses").innerHTML="";
if (str1=="")
  {
    document.getElementById("Courses").innerHTML="";
    return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp1=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
    xmlhtt1p=new ActiveXObject("Microsoft.XMLHTTP");
  }
    xmlhttp1.onreadystatechange=function()
      {
      if (xmlhttp1.readyState==4 && xmlhttp1.status==200)
        {
        document.getElementById("Courses").innerHTML=xmlhttp1.responseText;
        }
      }
xmlhttp.open("POST","getUserCourseInfo.php");
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("q="+ str1);
}

Notice that the last three lines reference xmlhttp whereas the rest of the function is referencing xmlhttp1.