jQuery ajax call behaving unexpectedly

JavaScript
1

Hi there,

I have a database driven website, which shows a list of files that have been uploaded by users.

I have a script called controller.php, which generates the HTML:


//excerpt
<?php foreach($uploads as $upload): ?>
<div class="upload">
<p><?php echo $upload['filename'] ?> | 
      <?php echo $upload['size'] ?> | 
      <?php echo $upload['type'] ?>
</p>
<form method="post" action="index.php">
<input type="hidden" name="id" value="<?php echo $upload['id'] ?>
<input type="submit" name="download" id="download" value="Download">
<input type="submit" name="delete" id="delete" value="Delete">
</div>
<?php endforeach; ?>

When the download button is clicked, the file is downloaded, and then deleted from the server, and the database entry is deleted.

All gravy so far, now I need to update the page, so that the downloaded/deleted item does not show on the page anymore.

So here’s my Jquery:


$(document).ready(function(){
  $('#content').load('path/to/controller.php');
  $('#download, #delete').click(function(){
    $('#content').load('path/to/controller.php');
  });
});

All works fine, until I re-load the controller.php script on the click event of ‘#download’, nothing changes.

I guess it could be for one of two reasons. Either a) I am reloading the script before the changes have been made to the database, or b) .load() doesn’t behave this way, and I should be approaching this problem a different angle.

Any assistance would be great.

Many thanks,
Mike

2

This has been solved.

The issue was that I was performing the SQL query on a different script to the one that I was trying to load, so the HTML was being generated by the controller script before the database shenanigans occurred. I could only ever load the same HTML.

I moved the database script to the controller script and works like a charm.

M

3

That was awesome. You posted the problem, and then followed up with specifically how you fixed it.

Wish more posters did that, instead of just “oh wait I got it” :slight_smile:

4

Aww, shucks! :blush:

Actually, I realise now that that post is acomplete a fabrication. I actually ended up doing things slightly differently. I realised I didn’t need to make an ajax call at all, i just hid the div like so:


$(document).ready(function(){
  $('#download').click(function(){
    $(this).parent().hide();
  });
});

Then I moved the php script back to index.php. If the user ever reloads the page, it looks seamless, cos the div that’s been deleted is not generated by the php script.

It’s a work-around cos I actually could get the desired effect using the .load() function as I described above, plus I think it’s probably more efficient.

Mike