Jquery load() doesn't load php files

Question

The Head

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js">  </script>

The HTML

<div id=info></div>

<div id="tousarticles">

<div class="titre" id="listitem_4">
    <p>Blahblahblah</p>
</div>

<div class="titre" id="listitem_59">
    <p>Blahblahblah</p>
</div>

<div class="titre" id="listitem_58">
    <p>Blahblahblah</p>
</div>

<div class="titre" id="listitem_71">
    <p>Blahblahblah</p>
</div>

</div>

The Javascript

<script type="text/javascript">
$(document).ready(function() {
    $("#tousarticles").sortable({
        opacity: 0.6,
        axis: 'y',
        update : function () {
            var order = $('#tousarticles').sortable('serialize');
            alert(order); // It alerts "listitem[]=59&listitem[]=4&listitem[]=58&listitem[]=71"
            $("#info").load("test.php?"+order, function() {
                alert( "Load was performed." ); // It alerts "Load was performed."
            });
        }
    });
});
</script>

And the php

<?php 
$fp = fopen("./upload/file.txt","w+");
// Normaly, the DB entry php script but, here, I put some stuff visible on a writable repertory on my server to know if it runs.
?>

The sortable interface works well: I can change the place of the DIV "listitems" without problem. But the test.php doesn't load at all.

Here is the process

I change the first paragraph with the second and the first alert comes with the correct string (listitem[]=59&listitem[]=4&listitem[]=58&listitem[]=71).I click "OK".

So, as expected, the second alert comes with "Load was performed." I click "OK".

However, the test.php script did'nt load.

The alert "Load was performed." comes even if the file does'nt exist (testtt.php for example).

Going to my server via ftp, there is no file /upload/file.txt. But the test.php runs well and creates an "upload/file.txt" when launched via url.

If this is your entire PHP code then the problem is that fopen() doesn't really output anything so you're loading an empty file. If there's some code below, you should check your browser's console and see if the URLs are not being cached as well. — Marius
– Marius, Commented Jul 20, 2015 at 12:48

Martin Verner · Accepted Answer · 2015-07-20 12:48:41Z

1

The following will always trigger as it's the complete callback.

$("#info").load("test.php?"+order, function() {
  alert( "Load was performed." ); // It alerts "Load was performed."
});

Try this, hopefully this will tell you what's wrong.

$("#info").load("test.php?"+order, function(response, status, xhr) {
  alert( "Load was performed. Status="+status+", xhr.statusText="+xhr.statusText ); // It alerts "Load was performed."
});

answered Jul 20, 2015 at 12:48

Martin Verner

7627 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Frédéric Faux Over a year ago

It shows: "Load was performed. Status=error, xhr.statusText=Forbidden"

Martin Verner Over a year ago

Can you manually call the .php files with same url as the ajax script?

Martin Verner Over a year ago

Any chance it's cross domain?

Frédéric Faux Over a year ago

it's resolved with the post() methode with I use following the same way MonkeyZeus suggested above. Thank you for cooperation.

MonkeyZeus · Accepted Answer · 2015-07-20 16:50:42Z

0

<div id=info></div>

Should be

<div id="info"></div> <!-- You forgot double quotes -->

Your PHP should actually echo something rather create a file:

<?php
echo 'Hello, this is dog';
?>

More Info:

The .load() method from jQuery uses the GET method by default and accepts a total of 3 parameters.

I would recommend trying the following:

$("#info").load("test.php", $('#tousarticles').sortable('serialize'), function() {
    alert( "Load was performed." ); // It alerts "Load was performed."
});

edited Jul 20, 2015 at 16:50

answered Jul 20, 2015 at 12:49

MonkeyZeus

20.8k4 gold badges41 silver badges83 bronze badges

5 Comments

MonkeyZeus Over a year ago

@FrédéricFaux There is something going on which you are not seeing. Try debugging your AJAX .load() by taking a look at this answer: stackoverflow.com/a/21617685/2191572

Frédéric Faux Over a year ago

Using the Firefox's Firebug extension, I can see a "403 Forbidden" message for this file. But I can access it directly by the url bar.

MonkeyZeus Over a year ago

@FrédéricFaux can you try test.php without the serialized data?

Frédéric Faux Over a year ago

OK, it works without serialized data by ajax load(). Furthermore it returns a 403 when I load the test.php with the datas by the url. I tried to send the chain with the post() method and it works too with the serialized data witch I can use in the php file. It seem the jquery load() method use the GET method and the server do only want the POST method.

MonkeyZeus Over a year ago

@FrédéricFaux Glad to hear it worked! Please see my update with more info.

Collectives™ on Stack Overflow

Jquery load() doesn't load php files

2 Answers 2

4 Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related