диалог jquery открывается только в первый раз

Question

У меня есть диалоговое окно jquery, и когда я нажимаю кнопку, он открывается, но только в первый раз, когда я закрываю его и нажимаю второй раз по той же кнопке, что он не появляется. Вот мой код:

Сценарий:

$(function() { 
    $("#dialogPicture").dialog({ 
     autoOpen: false 
    });  

    $(".buttonClass").on("click", function() { 

     // get the div element with the id dialogClass contained at the same scope as button!  

     var id = ($(this).siblings(".dialogClass").attr("id")); 
     $("#" + id).dialog({ 
      autoOpen: false 
     }); 
     $("#" + id).dialog("open").css({ 
      "font-size": "13px" 
     });  
    });  
}); 

HTML:

<td> 
    <?=$row['NOMER']?><input id="btn2" class="buttonClass" type="button" value="ВИЖ" /> 
    <div class="dialogClass" id="dialogPicture_<?=$row['NOMER'];?>" style="display:none;"> 
     <table class="bilet"> 
     <tr> 
      <h2> 
       <td colspan="4"> 
        <div align="center"><strong>ПРЕВОЗЕН БИЛЕТ</strong></div> 
       </td> 
      </h2> 
     </tr> 
     <p> 
      <tr > 
     <td colspan="2" align="right"> 
     </table> 
    </div> 

Answer 1

Вы можете попробовать это.

Вы должны использовать этот код, чтобы уничтожить Диалог в разделе Кнопка

$("#TestMenuDialog").dialog("close").dialog("destroy").remove(); 

var NewDialog = $('<div id="TestMenuDialog"><p style="color:Red;style="font-size:7x;font-weight:normal">' + Message + '</p></div>'); 
     NewDialog.dialog({ 
      modal: false, 
      title: "Test Dialog", 
      height: 200, 
      width: 375, 
      show: 'clip', 
      hide: 'clip', 
      buttons: [ 
        { text: "OK", click: function() { $(this).dialog("close").dialog("destroy").remove(); } } 
      ] 
     }); 

Проверьте Jfiddle Link Он отлично работает

http://jsfiddle.net/zpP3c/1/

Answer 2

Я думаю, что проблема в том, что на каждой кнопке мыши вы создайте новый экземпляр диалогового окна.
Попробуйте инициализировать все диалоговые окна в начале сценария и позволить кнопкам открывать их.
Другой проблемой является то, что диалог ДИВ больше не находится на столе после инициализации:
<div id="btn<?=$row['NOMER']?>" .....

 $(function() { 
      $(".dialogClass").each(function(){ 
       $(this).dialog({ autoOpen: false }); 
      }); 

       $(".buttonClass").on("click", function() { 

       // get the div element with the id dialogClass contained at the same scope as button!  

       var btnId = ($(this).attr("id")); 
       btnId = btnId.replace("btn",""); 
       $("#dialogPicture_" + btnId).dialog("open").css({ 
        "font-size": "13px" 
       });  
      }); 
     });