Диалоговое окно jquery не отображается во второй раз ........?

Question

Я использую простое модальное окно dialg pop up, чтобы показать таблицу. когда я нажму на ячейку этой таблицы, тогда появится другое окно диалога jquery, и в этом всплывающем окне я покажу другую таблицу (динамический контент). Теперь проблема заключается в обоих dilaog придумали хорошо, когда я доступ к ним в первый раз, но не работает во второй раз в Google Chrome (версия 19.0.1084.56 м) и работает правильно в Mozilla (13.0.1)

I am giving some code snippet if there is something wrong plz help me.... 
//my first function which creates simple modal dialog on which i am writing content of another page dash.jsp (creating table) 
     // Maptrans.jsp page 
     function clicker1(){ 
          alert("modal1"); 
        var divString="<table>"+ 
       "<tr>"+ 
           "<td> 
            <table> 
             <div id='dash'></div> 
            </table> 
          </td>"+ 
         "</tr> 
       </table>"; 
         alert("modal2"); 
         $("#basic-modal-content").html(divString); 
         $("#basic-modal-content").modal(); 
         alert("modal3"); 


    //Getting data of dash.jsp and write on dash div 
       $.post("dash.jsp",function(data){ 
         $("#dash").html(data); 
       }); 

// dash.jsp function called when i will click on cell of first table 
    function access(test1,facilityName,status){ 
     alert("dialog1"); 
var divString="<table>"+ 
         "<tr>"+ 
          "<td > 
           <div id='rfidMove'><img src='img/basic/loader0.gi/></div> 
         </td>"+ 
     "</tr> 
       </table>"; 

      alert("dialog2"); 

$("#rfi").html(divString); 

$("#rfi").dialog({ 
      width: '650', 
      height: '500', 
      zIndex : '3000', 
      modal:true, 
      title: "RFID INVENTORY DETAIL", 
      overlay: { opacity: 0.1, background: 'black'}, 
      open: function(event, ui) { 
       $("#rfidMove").css("display", ""); 
      }, 
      close: function(event, ui){ 

      $("#rfi").dialog('destroy'); 

      } 
    }); 

    alert("dialog3"); 


    $.post("RfidInventory.jsp?","container="+test1+"&facilityName="+facilityName+"&status="+status, function(data){ 

     alert("dialog4"); 

     $("rfidMove").css("display","none"); 
     $("#rfi").html(data); 

     }); 
} 


// In both function i am getting alert before creation of dialog but after dialog creation code not.... 
I have spent alot of time to figure it out but unable to found any solution plz help ... Thanks 

Answer 1

Является ли это необходимо, чтобы $("#rfi").dialog('destroy'); каждый раз, когда диалог закрывается?
Я думаю, лучше создать диалог один раз в другом месте, например, в jquery.ready() и до .open() он нажимает в вашей ячейке таблицы.

Edit:
Может быть, вам нужно что-то вроде этого:

$(function(){ 
    //construct dialog once in jquery.ready() 
    $("#rfi").dialog({ 
      width: 650, 
      height: 500, 
      zIndex : 3000, 
      modal:true, 
      title: "RFID INVENTORY DETAIL", 
      overlay: { opacity: 0.1, background: 'black'}, 
      open: function(event, ui) { 
       $("#rfidMove").css("display", ""); 
      } 
    }); 
}) 

...

function access(test1,facilityName,status){ 
     alert("dialog1"); 
     var divString="<table>"+ 
         "<tr>"+ 
          "<td > 
           <div id='rfidMove'><img src='img/basic/loader0.gi/></div> 
         </td>"+ 
     "</tr> 
       </table>"; 

      alert("dialog2"); 

$("#rfi").html(divString); 

    //reuse already created dialog 
    $("#rfi").dialog('open'); 

    alert("dialog3"); 


    $.post("RfidInventory.jsp?","container="+test1+"&facilityName="+facilityName+"&status="+status, function(data){ 

     alert("dialog4"); 

     $("rfidMove").css("display","none"); 
     $("#rfi").html(data); 

     }); 
} 

И исправить вам отступы пожалуйста. Это больно смотреть на код :)