Jquery подтверждает выводит текст несколько раз

Question

У меня есть диалоговое окно подтверждения jquery, которое принимает некоторые значения и спрашивает, хотим ли мы удалить записи для них. Когда я нажму кнопку, появится диалоговое окно. Проблема в том, что если я просто закрою диалоговое окно (не выбирая ни Да, ни НЕТ), в следующий раз, когда я открою это диалоговое окно, он отобразит сообщение дважды. Если я сделаю это в третий раз, он отобразит его 3 раза и так далее ... В противном случае он отлично работает. Но я тоже хочу исправить эту проблему. Примечание. В одном диалоговом окне отображается несколько сообщений.

Это мой код:

<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> 

И здесь я создаю DIV для него:

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

Im не прикладывая сообщение внутри DIV, потому что мне нужно, чтобы передать имя значения и фамилия в сообщении. Но я думаю, что это вызывает проблему.

Answer 1

Для каждого щелчка необходимо очистить содержимое $("#dialog"), иначе каждый щелчок приведет к добавлению дополнительного абзаца в div.

Изменить

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

в

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

или даже

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

Answer 2

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