Jump to content

Retrieving HTML through JQuery


9three

Recommended Posts

Hi,

 

I currently have a section where I just do a while loop and load all rows within there. What I would like to do now is load that while loop only when the user clicks on the link(through AJAX). Is there a function and/or tutorial anyone knows about that could accomplish this?

 

I've never passed this type of information through AJAX.

Link to comment
https://forums.phpfreaks.com/topic/176012-retrieving-html-through-jquery/
Share on other sites

hm..

 

Basically this is what I have:

 

<div class="section">
<?php 
while ($row = $objStatement->fetch()) {
  echo '<div class="1">'.$row['id'].'</div> <div class="2">'.$row['name'].'</div> <div class="3">'.$row['ph'].'</div>';
}
?>
</div>

 

Now this loads all my data in that order.

 

What I want to do now is do now is load that loop when the user clicks on a link that pertains to that section instead of loading when the user gets to the page.

 

Is that better?

 

EDIT:

 

So instead do this:

<a href="#" onclick="LoadSection1();">Section1</a>
<div class="section">
//HTML/While Loop would load through here
</div>

Ok, then your php might look something like....

 

// make query

$array = array();
while ($row = $objStatement->fetch()) {
  $array[] = $row;
}
echo json_encode($array);

 

Your html like....

 

<a href="#" id="section1">Section1</a>
<div class="section">
</div>

 

And your js something like...

 

$(document).ready(function() {
    $("#section1").click(function() {
        $.ajax({
            type: "GET",
            url: 'yourphppage.php',
            dataType: "json",
            success: function(d) {
                var html = '';
                for (i=0;i<=d.length;i++) {
                    html += '<div class="1">'+d[i].id+'</div> <div class="2">'+d[i].name+'</div> <div class="3">'+d[i].ph+'</div>';
                }
            }
            $("section").html(html)
    });
});

 

Take a look at the man page for jQuery's ajax object if you need more details.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.