repeated use of ToggleClass to run script
I'm a jQuery UI noob. For an admin page, where the admin has the
ability to publish records, I set it up so they can click on a ui-icon-
bullet next to the record listing. This works like a charm the first
time. It changes the ui-icon to an open bullet, it runs the php
script that its tied to it also works the other way around to publish
an unpublished record. But when I try it more than once without
refreshing the page (to toggle it between published and unpublished),
it appears to be working (it toggles the class as if it's working),
but doesn't run the php script, so it doesn't actually change the db
record, and doesn't publish or unpublish. Then when I refresh it
works one time again.
Is there a way to run the php script repeatedly, like a toggle on/off
switch? Here's my jQuery code. Any help is much appreciated!
/// ***** PUBLISH ********
$(function() {
$(".ui-icon-radio-on").click(function(){
var element = $(this);
var del_id = element.attr("id");
var info = 'action=publishRecordsListings&rcdID=' + del_id;
{
$.ajax({
type: "POST",
url: "updateDB.php",
data: info,
success: function(){
}
});
$(this).toggleClass("ui-icon-radio-on");
$(this).toggleClass("ui-icon-bullet");
}
return false;
});
});
/// ***** UNPUBLISH ********
$(function() {
$(".ui-icon-bullet").click(function(){
var element = $(this);
var del_id = element.attr("id");
var info = 'action=unpublishRecordsListings&rcdID=' + del_id;
{
$.ajax({
type: "POST",
url: "updateDB.php",
data: info,
success: function(){
}
});
$(this).toggleClass("ui-icon-bullet");
$(this).toggleClass("ui-icon-radio-on");
}
return false;
});
});