[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

AJAX stopped working randomly JavaScript PHP

Posted on 2007-10-19
12
Medium Priority
?
295 Views
Last Modified: 2013-12-13
I have an AJAX script that all of a sudden stopped working. The HTML page calling the function is this:

<DIV id="emailsent"></DIV>
 <input name="Submit" type="submit" value="Submit"  onclick="register('ajax.php?register=yes')"/>

the Javascript function has this:

document.getElementById("emailsent").innerHTML =
XMLHttpRequestObject.responseText;

the PHP is this:

if (@$_GET['register']=="yes")
{
echo 'test';
}

For the stupidest reason, it doesnt work anymore. I dont know what to do, im going crazy because 5 minutes ago it was working fine. Any ideas?
0
Comment
Question by:jcbodyworks
  • 5
  • 3
  • 3
  • +1
12 Comments
 
LVL 21

Expert Comment

by:nizsmo
ID: 20113195
You are missing a few things if that is all your code, I tried it out (completed your code a little) and all works.

This is the javascript and html page together:

<script language="javascript" type="text/javascript">
function register(func)
{
      var page_request = false;
       
      // If  the browser is Mozilla, Safari etc
      if (window.XMLHttpRequest)
      {
            page_request = new XMLHttpRequest();
      }
 
      // If the Browser is Internet Explorer
      else if (window.ActiveXObject)
      {
            try
            {
                  page_request = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e)
            {
                  try
                  {
                        page_request = new ActiveXObject("Microsoft.XMLHTTP");
                  }
                    catch (e){}
            }
      }
      else { return false; }
        
      page_request.open('GET', func, true);
      
      // When request is Ready
      //var reply;
      page_request.onreadystatechange=function()
      {      
            if (page_request.readyState == 4 && page_request.status==200)
            {
                  
                  document.getElementById("emailsent").innerHTML = page_request.responseText;
                  
            }
      }
      if(window.XMLHttpRequest)
      {
            page_request.send(null);
      }
      else
      {
            page_request.send();
      }
      
}

</script>

<DIV id="emailsent"></DIV>
 <input name="Submit" type="submit" value="Submit"  onclick="register('test2.php?register=yes')"/>


and this is the php page, which remains the same:

if (@$_GET['register']=="yes")
{
echo 'test';
}

And everything works!
0
 
LVL 13

Expert Comment

by:MasonWolf
ID: 20113208
Well, I didn't build this with support for older browsers, but as a test, you might want to give it a whirl. It should work on any modern browser, but it'll fail for Internet Explorer older than 6. See how it maybe looks different than your own code. I know it works because I tested. I can't say where your problem lies, since the code fragment you included looked fine.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function register(url)
{
   var XMLHttpRequestObject = new XMLHttpRequest();
   XMLHttpRequestObject.onreadystatechange = function() {
         if(XMLHttpRequestObject.readyState == 4)
      {
            document.getElementById("emailsent").innerHTML = XMLHttpRequestObject.responseText;
      }
      }
   XMLHttpRequestObject.open("GET", url, true);
   XMLHttpRequestObject.send(null);
}
</script>
</head>

<body>
<DIV id="emailsent"></DIV>
 <input name="Submit" type="submit" value="Submit"  onclick="register('ajax.php?register=yes')"/>

</body>
</html>

And the entire contents of ajax.php:
<?php
if (@$_GET['register']=="yes")
{
echo 'test';
}
?>
0
 

Author Comment

by:jcbodyworks
ID: 20113228
I putting all my code in here, so you can get a more exact idea of my dilemma. I think when I was testing my site, I overkilled the XMPHttpRequest Object with too many requests at once. Now, on the PHP I have a script that handles the input and inserts into the database, but I decided to simply place that handler inside comments, and simply add an echo statement to a DIV to just make sure there was communication. Well, nothing is happening, and mind you, it was working fine not too long ago! GRRR.

The HTML Page:
   <table width="547" height="403">
    <tr>
      <td><div class="applytitle">a. Basic Information</div></td>
      </tr>
      <tr>
      <td width="159" height="63"><div class="applycell">1. First Name <font color="red">*</font>:<br />
                  <input name="firstname" type="text" id="firstname" style="width:135px;" maxlength="40" />
      </div></td>
      <td width="171"><div class="applycell">2. Last Name <font color="red">*</font>:<br />
            <input name="lastname" type="text" id="lastname" style="width:135px;" maxlength="40" />
      </div></td>
        <td width="135"><div class="applycell">3. Gender:<br />
        <select name="gender" id="gender" style="width:140px;">
              <option value="na" selected="selected">Select</option>
              <option value="male">Male</option>
      <option value="female">Female</option>
    </select>
      </div></td>
     
    </tr>
    <tr>
      <td height="63"><div class="applycell">4. Birthday (mm/dd/yyyy):<br />
           <input name="birthday" type="text" id="birthday" style="width:135px;" maxlength="40" />
      </div></td>
      <td><div class="applycell">5. Referred By <font color="red">*</font>:<br />
           <select name="referredby" id="referredby" style="width:140px;">
              <option value="na" selected="selected">Select</option>
              <option value="yellowpages">Yellow Pages</option>
      <option value="googlesearch">Google Search</option>
      <option value="craigslist">Craigslist</option>
      <option value="dexyellowpages">Dex Yellow Pages</option>
      <option value="backpages">Backpages</option>
      <option value="kudzu">Kudzu</option>
      <option value="flyers">Flyers</option>
      <option value="wordofmouth">Word of Mouth</option>
      <option value="other">Other</option>
    </select>
      </div></td>
    <td><div class="applycell">6. Phone (xxx-xxx-xxxx) <font color="red">*</font>:<br />
            <input name="phone" type="text" id="phone" style="width:135px;" maxlength="40" />
      </div></td>
    </tr>
    <tr>
      <td height="63"><div class="applycell">7. Home Street:<br />
            <input name="homestreet" type="text" id="homestreet" style="width:135px;" maxlength="40" />
      </div></td>
      <td><div class="applycell">8. City:<br />
            <input name="city" type="text" id="city" style="width:135px;" maxlength="40" />
      </div></td>
     <td><div class="applycell">9. State:<br />
            <select name="state" id="state" style="width:140px;">
              <option value="na" selected="selected">Select</option>
              <option value="AL">AL</option>
      <option value="AK">AK</option>
      <option value="AZ">AZ</option>
      <option value="AR">AR</option>
      <option value="CA">CA</option>
      <option value="CO">CO</option>
      <option value="CT">CT</option>
      <option value="DE">DE</option>
      <option value="DC">DC</option>
      <option value="FL">FL</option>
      <option value="GA">GA</option>
      <option value="HI">HI</option>
      <option value="ID">ID</option>
      <option value="IL">IL</option>
      <option value="IN">IN</option>
      <option value="IA">IA</option>
      <option value="KS">KS</option>
      <option value="KY">KY</option>
      <option value="LA">LA</option>
      <option value="ME">ME</option>
      <option value="MD">MD</option>
      <option value="MA">MA</option>
      <option value="MI">MI</option>
      <option value="MN">MN</option>
      <option value="MS">MS</option>
      <option value="MO">MO</option>
      <option value="MT">MT</option>
      <option value="NE">NE</option>
      <option value="NV">NV</option>
      <option value="NH">NH</option>
      <option value="NJ">NJ</option>
      <option value="NM">NM</option>
      <option value="NY">NY</option>
      <option value="NC">NC</option>
      <option value="ND">ND</option>
      <option value="OH">OH</option>
      <option value="OK">OK</option>
      <option value="OR">OR</option>
      <option value="PA">PA</option>
      <option value="RI">RI</option>
      <option value="SC">SC</option>
      <option value="SD">SD</option>
      <option value="TN">TN</option>
      <option value="TX">TX</option>
      <option value="UT">UT</option>
      <option value="VT">VT</option>
      <option value="VA">VA</option>
      <option value="WA">WA</option>
      <option value="WV">WV</option>
      <option value="WI">WI</option>
      <option value="WY">WY</option>

            </select>
      </div></td>
    </tr>
      <tr>
      <td height="63"><div class="applycell">10. Zip Code:<br />
            <input name="zipcode" type="text" id="zipcode" style="width:135px;" maxlength="40" />
      </div></td>
        <td><div class="applycell">11. Seconday Phone (xxx-xxx-xxxx):<br />
            <input name="secondaryphone" type="text" id="secondaryphone" style="width:135px;" maxlength="40" />
      </div></td>
        <td><div class="applycell">12. Email Address<font color="red">*</font>:<br />
            <input name="email" type="text" id="email" style="width:135px;" maxlength="40" />
      </div></td>
      
      </tr>
      
      
      <tr>
      <td><p>
      <DIV class="applytitle">b. User Information</DIV></td>
      </tr>
<tr>
      <td height="63"><div class="applycell">13. Desired Username<font color="red">*</font>:<br />
            <input name="username" type="text" id="username" style="width:135px;" maxlength="40" />
      </div></td>
        <td><div class="applycell">14. Desired Password<font color="red">*</font>:<br />
            <input name="password" type="text" id="password" style="width:135px;" maxlength="40" />
      </div></td>
      </tr>
      
      
      </table></center>
      <center>
      <DIV id="emailsent"></DIV>
      <table>
    <tr>
      <td height="26"></td>
      <td><center>
        <input name="submitbtn" type="submit" value="Submit"  onClick="register('ajax.php?register=yes')"/>
      </center></td>
      <td></td>
    </tr>
      </table>

The JavaScript Page:

function register(dataSource)
{
      var obj1 = document.getElementById("firstname");
      var obj2 = document.getElementById("lastname");
      var obj3 = document.getElementById("gender");
      var obj4 = document.getElementById("birthday");
      var obj5 = document.getElementById("referredby");
      var obj6 = document.getElementById("phone");
      var obj7 = document.getElementById("homestreet");
      var obj8 = document.getElementById("city");
      var obj9 = document.getElementById("state");
      var obj10 = document.getElementById("zipcode");
      var obj11 = document.getElementById("secondaryphone");
      var obj12 = document.getElementById("email");
      var obj13 = document.getElementById("username");
      var obj14 = document.getElementById("password");
      
      var firstname = obj1.value;
      var lastname = obj2.value;
      var gender = obj3.options[obj3.options.selectedIndex].text;
      var birthday = obj4.value;
      var referredby = obj5.options[obj5.options.selectedIndex].text;
      var phone = obj6.value;
      var homestreet = obj7.value;
      var city = obj8.value;
      var state = obj9.options[obj9.options.selectedIndex].text;
      var zipcode = obj10.value;
      var secondaryphone = obj11.value;
      var email = obj12.value;
      var username = obj13.value;
      var password = obj14.value;
      
            if (window.XMLHttpRequest) {
            XMLHttpRequestObject =  new XMLHttpRequest();
            } else if (window.ActiveXObject) {
            XMLHttpRequestObject = new
            ActiveXObject("Microsoft.XMLHttp");
            }
            
            if (XMLHttpRequestObject) {
                  XMLHttpRequestObject.open("POST", dataSource);
                  XMLHttpRequestObject.setRequestHeader('Content-Type','application/x-www-form-urlencoded');


            XMLHttpRequestObject.onreadystatechange = function()
            {
                  if (XMLHttpRequestObject.readyState == 4 &&
                        XMLHttpRequestObject.status == 200) {
                        
                        
                        eval(XMLHttpRequestObject.responseText);
                        
                        delete XMLHttpRequestObject;
                        XMLHttpRequestObject = null;
                        }
                        
                        
                        
            }
            
            XMLHttpRequestObject.send("firstname=" + firstname +"&lastname=" + lastname + "&gender=" + gender + "&birthday=" + birthday +"&referredby=" + referredby +"&phone=" + phone +"&homestreet=" + homestreet +"&city=" + city +"&state=" + state +"&zipcode=" + zipcode +"&secondaryphone=" + secondaryphone +"&email=" + email +"&username=" + username +"&password=" + password);
      }
}

Then the PHP Page:

if (@$_GET['register']=="yes")
{
echo 'document.write = "THIS IS AN OUTPUT TEST";';
}
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 23

Expert Comment

by:basicinstinct
ID: 20113241
are you running your test page under the file: protpcol?  ajax is unpreidcatable unless running off a webserver...
0
 

Author Comment

by:jcbodyworks
ID: 20113252
no, im running off a webserver under the www.jcbodyworks.org domain i transferred into my virtual dedicated. The exact page im construction is www.jcbodyworks.org/register.html .
0
 
LVL 23

Expert Comment

by:basicinstinct
ID: 20113258
well you 'eval' the responseText... that ain't gonna do anything if you are just returning html...

eval(XMLHttpRequestObject.responseText);

change that to:

alert(XMLHttpRequestObject.responseText);

and you'll se it's working
0
 
LVL 23

Accepted Solution

by:
basicinstinct earned 2000 total points
ID: 20113262
also your php page is not working, it just hangs:

try it yourself: http://www.jcbodyworks.org/ajax.php?register=yes

so what's going on in the php server logs?
0
 
LVL 23

Expert Comment

by:basicinstinct
ID: 20113276
or, even better, change this:

eval(XMLHttpRequestObject.responseText);

to this:

document.getElementById("emailsent").innerHTML = XMLHttpRequestObject.responseText;

That will work like a charm.  The problem is on the PHP side.
0
 
LVL 13

Expert Comment

by:MasonWolf
ID: 20113279
Your javascript is sending through POST, but your php page is set up to receive GET. If you send by POST, it's just going to show you a blank page, which is what I see.
0
 

Author Comment

by:jcbodyworks
ID: 20113280
guys, I love you. I checked the error log, and I have this error:

[Fri Oct 19 17:17:35 2007] [error] [client 130.13.250.141] PHP Parse error:  syntax error, unexpected T_STRING in /home/jcbodyworks/public_html/ajax.php on line 29

apparently, on line 29 I had this:
$registration=date(Y/m/d H:i:s,strtotime("now"));

whic I now changed to this:
$registration=date("Y/m/d H:i:s",strtotime("now"));

now if u go to that page, it comes up with an appropriate output.
0
 
LVL 13

Expert Comment

by:MasonWolf
ID: 20113288
nice,
congrats jc
0
 
LVL 23

Expert Comment

by:basicinstinct
ID: 20113292
sweet :)
0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
It’s a season to be thankful, and we’re thankful for users like you who engage on site, solve technology problems, and network with others in the industry. What tech are we most thankful for? Keep reading.
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Suggested Courses
Course of the Month18 days, 9 hours left to enroll

825 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question