Double execution of ajax request
Hi,
I wrote a custom plugin for my task manager webapp. This plugin sets, e.g. a task, to done when a checkbox is clicked also a couple of javascript events are called (removing the task from the table, changing the row color...)
The problem is that this is done two times each time I click a checkbox
This is the code:
-
(function(jQuery) {
var self = null;
jQuery.fn.taskFinisher = function(o){
return this.each(function() {
new jQuery.taskFinisher(this, o);
});
};
jQuery.taskFinisher = function (e, o)
{
this.options = o || {};
this.checkbox = jQuery(e);
this.init();
};
jQuery.taskFinisher.fn = jQuery.taskFinisher.prototype = { taskFinisher: '1.0' };
jQuery.taskFinisher.fn.extend = jQuery.taskFinisher.extend = jQuery.extend;
jQuery.taskFinisher.fn.extend({
init: function() {
var self = this;
this.checkbox.click(function() { self.finishTask();});
},
finishTask: function(){
var task_id = $(this.checkbox).attr('id').split("_")[1];
var value = 0;
if($(this.checkbox).attr('checked')) { value = 1;}
$.ajax({
type : "POST",
url : "ajax/finishTask",
data : "id="+task_id+"&value="+value,
dataType : "json",
async : false,
success: function(json) {
$('#taskRow_'+task_id).attr('class', json.class);
$('#taskStatus_'+task_id).css('background', 'url(images/icons/'+json.status_image+'.png) no-repeat');
$('#taskProgress_'+task_id).html(json.progress);
$('#taskStatus_'+task_id).html(json.status);
if(json.remove_row == 1){
$('#taskRow_'+task_id).fadeOut('slow');
}
if(json.total == 0){
console.log("DELETE ROW");
}
}
});
}
});
})(jQuery);
Can someone tell me what I am doing wrong?