i have a file which echoes out data from a database.

I wish to have a load more button which appends this file so that it will keep loading the rest of the results.

The php page works fine but need help with the jquery...

have used this else where for a json return but dont think this is needed for this.

So i am trying this:

$(document).ready(function(){
$("#loadmore").click(function () {
     $("#content").append('includes/loadmorebuilds.php');
});
});

In essence, this works but it appends 'includes/loadmorebuilds.php' as just that. I simply appends those words and not the file.

Any help on this?

Many thanks!

i have a file which echoes out data from a database.

I wish to have a load more button which appends this file so that it will keep loading the rest of the results.

The php page works fine but need help with the jquery...

have used this else where for a json return but dont think this is needed for this.

So i am trying this:

$(document).ready(function(){
$("#loadmore").click(function () {
     $("#content").append('includes/loadmorebuilds.php');
});
});

In essence, this works but it appends 'includes/loadmorebuilds.php' as just that. I simply appends those words and not the file.

Any help on this?

Many thanks!

• javascript
• php
• jquery
• append

• You're now appending #content with the string 'includes/loadmorebuilds.php'. If you want to fetch the file itself I'd suggest you use .load() to fetch the file asynchronously – Joren Commented Oct 3, 2013 at 21:44

3 Answers 3

You could use $.ajax to get content from file to be appended into DOM. One important thing is that you should use Relative PATH to your web root on url parameter in $.ajax

So it will bee like this

$('#loadmore').click(function() {
    $.ajax({
       url: '/relative/path/to/your/script',
       success: function(html) {
          $("#content").append(html);
       }
    });
});

And make sure you should be able to access your script on http://www.example./relative/path/to/your/script

You have two options:

$('#content').load('includes/loadmorebuilds.php');

Which will replace the content of #content with the new html.

Or this:

$.ajax({
    url: 'includes/loadmorebuilds.php'
}).done(function(data) {
    $('#content').append(data);
});

Which will append the new data.

use $.ajax

$(document).ready(function(){
        $(".loader").click(function(){

      $.ajax({
                url:"index.php",
                dataType:"html",
                type:'POST', 

                beforeSend: function(){
                },
                success:function(result){
                      $(".content").append(result);
                 },

        });
    });
    });