CODEWITHSUNDEEP
javascriptjqueryhtml
Lazarus Rising
Lazarus Rising

Reputation: 2685

Jquery confirm displays text several times

I have a jquery confirm dialog that takes some values and asks if we want to delete the records for them. The dialog box is prompted when I click a button. The problem is that if I simply close the dialog (not choosing nor Yes neither NO), the next time I open that dialog, it will display the message twice. If I do like this for a third time it displays it 3 times and so on ... Otherwise it works fine. But I want to fix this issue too. Note: Several messages are displayed inside the same dialog box.

This is my code:

<script>
            $(document).ready(function(){
                     $(".delete-button").click(function() {
                            var $row = $(this).closest("tr");    // Find the row
                        var names = $row.find(".name").text(); // Find the name
                        var surname = $row.find(".surname").text(); // Find the surname  
                            $("#dialog").dialog({
                                autoOpen: false,
                                buttons : {
                                "Yes" : function() {
                                    $.ajax({  type: "POST",  url: "delete_lecturer.php", data: { x: names, y: surname}   })   //sends post query to delete the selected row
                                .done(function( msg ) {location.reload();})  //reloads page in order for the change to take become evident
                                    },"No" : function() {$(this).dialog("close");}
                            }
                            });
                        $("#dialog").dialog("open");
                        $('<p>Are you sure you want to delete lecturer '+names+' '+surname+'?</p>').appendTo('#dialog');
                });
        });
</script>

And here I create the div for it:

<div id="dialog" title="Action can not be reversed!"></div>

Im not putting the message inside the div because i need to pass the values name and surname in the message. But I think this is causing the problem.

Upvotes: 0

Views: 111

Answers (2)

sanman
sanman

Reputation: 780

 $("#dialog").empty().dialog("open");

Upvotes: 0

user2959229
user2959229

Reputation: 1355

You need to clear the contents of $("#dialog") for each click, otherwise each click results in an additional paragraph being added to the div.

Change

  $("#dialog").dialog("open");

to

 $("#dialog").html('').dialog("open");

or even

$("#dialog").html('<p>Are you sure you want to delete lecturer '+names+' '+surname+'?</p>').dialog("open");

Upvotes: 1

Related Questions