Question

I have the following code:

var wait = 500;
$(document).on("click",".new_game_list_row",function(event){
        var self = $(this);
        //As the element clicked on has it's data attributes defined
        //Retrieves it when the element is clicked on
        var id_quiz_list = self.data('quizlistId'),
            difficult = self.data('difficult');
            userid = $("#new_game_list_wrap").data('userid');
                setTimeout(function(){
                    $.post("new_game_add.php","userid="+userid+"&id_quiz_list="+id_quiz_list+"&difficult="+difficult,function(data){
                        $answer = data;
                        $("#new_game_list_wrap").fadeOut("slow",function(){
                            self.remove();
                            $("#quiz_list_wrap").append('<div class="quiz_list_row" data-quizlist-id="'+id_quiz_list+'" data-quizlevel-reached="0" '+
                            '><div class="inline list_cell" id="quiz_list_cell_rownew_id1">Quiz '+id_quiz_list+'</div><div '+
                            'class="inline list_cell" id="quiz_list_cell_rownew_id2">Current level: 1</div>');
                            showtrick(id_quiz_list,1);
                        }); 
                    }, "html");  
                }, wait);
    });

I’m trying to use setTimeout() to avoid multi clicks on the row. My table is getting full of ghost entries.

I tried delay but it haven’t work.

Any idea?

Answer 1

I solved with this:

var isClickable=true, wait = 500;
$(document).on("click",".new_game_list_row",function(event){

    if(isClickable) {
        isClickable = false;
        var self = $(this);
        //As the element clicked on has it's data attributes defined
        //Retrieves it when the element is clicked on
        var id_quiz_list = self.data('quizlistId'),
            difficult = self.data('difficult');
            userid = $("#new_game_list_wrap").data('userid');
            $("#new_game_list_wrap").fadeOut("slow");
            $.post("new_game_add.php","userid="+userid+"&id_quiz_list="+id_quiz_list+"&difficult="+difficult,function(data){
                $answer = data;
                    self.remove();
                    $("#quiz_list_wrap").append('<div class="quiz_list_row" data-quizlist-id="'+id_quiz_list+'" data-quizlevel-reached="0" '+
                    '><div class="inline list_cell" id="quiz_list_cell_rownew_id1">Quiz '+id_quiz_list+'</div><div '+
                    'class="inline list_cell" id="quiz_list_cell_rownew_id2">Current level: 1</div>');
                    showtrick(id_quiz_list,1);
            }, "html"); 
                setTimeout(function(){
                    isClickable = true;
                }, wait);
    }
});

Problem solved.