Refresh div with Jquery on click

Question

Lets say I have a page with div and mysql data in it. For example code below:

<div id="example">
  <table class="table table-striped table-bordered">
    <thead>
      <tr>
        <th>#</th>
        <th>Name</th>
      </tr>
    </thead>
    <tbody>

      <?php $num_rows=1 ; // store the record of the "tblstudent" table into $row while ($row=m ysqli_fetch_array($result)) { // Print out the contents of the entry echo '<tr>'; echo '<td>' . $num_rows . '</td>'; echo '<td>' . $row[ 'name'] . '</td>'; $num_rows++;
      } ?>

    </tbody>
  </table>
</div>

If I want to only refresh certain part of my page in this case the <div id="example">, How can I do that with just a single page and not using .load() or $.post. Is it actually possible??

@charlietfl , he wants to explore , rather than doing same other people tried using ajax — Pratik Joshi
– Pratik Joshi, Commented Oct 13, 2014 at 3:54

Kait · Accepted Answer · 2014-10-13 02:06:33Z

1

What you posted is PHP - within PHP there's no way to update the page at all. You'd be using JavaScript do that.

If you want to refresh a certain part of your page, AJAX is typically the way to do it (either $.ajax or .load()). Since you don't want/are unable to use AJAX, an IFRAME is really the only other way to do it. Frame out your content in a separate page, then include it via an IFRAME. You can use one of these two methods to refresh it:

document.getElementById('#FRAME').contentDocument.location.reload(true);

var iframe = document.getElementById(FrameId);
iframe.src = iframe.src;

answered Oct 13, 2014 at 2:06

Kait

1087 bronze badges

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

Comments

Akash Sarawagi · Accepted Answer · 2014-10-13 07:07:25Z

1

what you do clone your object on page load. You need to take global variable.

var cloneObj;
$(document).ready(function (){
    cloneObj= $("#example1").clone();
});

Now whenever you need to refresh that element just call this block of code given below.

$("#example1").replaceWith(cloneObj.clone());

I have used this code in my previous answer. please check this FIDDLE

I hope it helps you. If not than please ask. I will try again

answered Oct 13, 2014 at 7:07

Akash Sarawagi

2071 silver badge5 bronze badges

1 Comment

sg552 Over a year ago

didn't work on refresh. It's not important really because I got it done using load() only that I'm curious whether there's other alternative for loading external file or echo json.

Collectives™ on Stack Overflow

Refresh div with Jquery on click

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related