Instead of building a new system entirely use what you have already
use "progressive enhancement".
You have "delete" buttons, with specific names that correspond with
the news items. When they're clicked they submit to a specific URL.
What you can do is catch the click and do the submit via AJAX.
For instance:
<form action="modify.php" method="post">
...
<input type="submit" name="delete51" value="Delete" class="delete">
...
<input type="submit" name="delete52" value="Delete" class="delete">
...
</form>
$(function() {
$('input.delete').click( function() {
$.ajax({
type: this.form.method,
url: this.form.action,
data: this.name + "=" + this.value,
success: function( msg ) { /* called if succeeded */ }
});
return false;
})
});
This has the added advantage that should your site be viewed on a
browser without JavaScript enabled it will still work.
More info on $.ajax here:
http://docs.jquery.com/Ajax#.24.ajax.28_properties_.29
You may also like to add an additional argument to the "data" string
(say "ajax=true") just so you know the request is coming via AJAX
rather than a "normal" button press. That way you know you don't need
to return the whole page, just confirmation about if the delete went
ok.
That's just a bare bones implementation, if you want something a bit
more advanced I suggest taking a look at Mike Alsup's Form Plugin:
http://www.malsup.com/jquery/form/
Karl Rudd
On 7/20/07, bytte <[EMAIL PROTECTED]> wrote:
I'm starting out with jQuery, and as I was trying to implement jQuery
in a simple CMS I made to make the CMS more fancy, I ran into this
problem.
Say I'm having a news page on my website. The CMS displays all news
items that are in the database. The CMS is built using PHP and MySql.
So on that php page all news items are listed. If I want to delete a
news item, I can click the "delete" button next to the news item. This
works in PHP.
Now I want to use jQuery to ajaxify things. If one clicks the delete
button, I want the deletion to happen without a page reload. So I
assume I write a javascript function using jQuery that calls an
external PHP file in which the item gets deleted. But of course that
PHP file needs to know the ID of the news item, to make sure it is
deleting the right item. How do I pass this ID as an argument to the
javascript function?
I'm aware of this: $.get("test.php", { id: "345", action:
"delete" } );
But I want the values for id and action to be dynamic.
