Jquery Dialog - div desaparece después de la inicialización

JQuery Dialog me está causando mucho dolor últimamente. Tengo el siguiente div que quiero que aparezca. (No haga caso de que las clases no muestran las comillas en la sintaxis)Jquery Dialog - div desaparece después de la inicialización

TABLE class=widget-title-table border=0 cellSpacing=0 cellPadding=0> 
<TBODY> 
<TR> 
    <TD class=widget-title><SPAN class=widget-title>Basic Info</SPAN></TD> 
    <TD class=widget-action> 
    <DIV id=edit-actions jQuery1266325647362="3"> 
     <UL class="linkbutton-menu read-mode"> 
      <LI class="control-actions"> 
       <A id="action-button" class="mouse-over-pointer linkbutton">Delete this     stakeholder</A> 
      <DIV id="confirmation" class="confirmation-dialog title=Confirmation"> 
       Are you sure you want to delete this stakeholder? 
      </DIV> 

</LI></UL></DIV></TD></TR></TBODY></TABLE>

El jQuery para esto es ...

$(document).ready(function() { 

$('#confirmation').dialog({ 
    bgiframe: true, modal: true, autoOpen: false, closeOnEscape: false, 
    draggable: true, position: 'center', resizable: false, width: 400, height: 150 
    }); 

});

Y el diálogo 'open'ed por

var confirmationBox = $('#confirmation',actionContent); 
if (confirmationBox.length > 0) { 


    //Confirmation Needed 
    $(confirmationBox).dialog('option', 'buttons', { 
     'No': function() { 
      $(this).dialog('close'); 
     }, 
     'Yes': function() { 
      $('ul.read-mode').hide(); 
      $.post(requestUrl, {}, ActionCallback(context[0], renderFormUrl), 'json'); 
      $(this).dialog('close'); 
     }    
    }); 

    $(confirmationBox).dialog('open'); 

}

El problema comienza en la inicialización misma. Cuando se carga el documento, el <div #confirmation> se elimina de la marca. Tuve un problema similar anteriormente, pero no puedo usar esa solución aquí. En esta página puedo tener múltiples divs PopUp.

Cuando agregue la inicialización justo antes de abrirla; la forma apareció. Pero después de cerrarlo, el div se elimina; así que no puedo volver a ver la ventana emergente.

Fuente

2010-02-16 Zuber

¿Ha mirado la consola en firebug para ver si hay algún error? – Samuel

No se muestran errores en la consola – Zuber

¿Por qué no utiliza jquery ui – ant

Bien. Creo que lo he conseguido gracias a la ayuda de ustedes.

Algunos "autodefinida" hechos sobre el diálogo que ahora sé (Por favor, corrija si estoy equivocado):

Cuando un <div> se inicializa como un cuadro de diálogo, que se retira de su ubicación original y movido al elemento <body> en un <div class="ui-dialog">. Por lo tanto, 'naturalmente' desaparece.
Para seleccionar el cuadro de diálogo, ahora necesita un identificador único. Puede ser el id en la mayoría de los casos, o algunos otros atributos en ese div lo que lo hace único en la página.

El marcado de cuadro de diálogo se crea cada vez que se inicializa el cuadro de diálogo. Por lo tanto, en el caso de las llamadas AJAX si se inicia un diálogo ya existente, obtendrá la ventana emergente más de una vez (tantas veces que se haya reiniciado). Para resolver esto, eliminé las marcas de diálogo existentes antes de volver a publicar. Tuve que hacer esto porque mi respuesta AJAX puede tener algunos diálogos que deben iniciarse.

function InitializeConfirmationDialog() { 
    $('div.confirmation-dialog').each(function() { 
    var id = $(this).attr("id"); 
    if ($('div.ui-dialog-content[id="' + id + '"]').length > 0) { 
     $('div.ui-dialog-content[id="' + id + '"]').parents('div.ui-dialog:first').html("").remove();     
    } 
    $(this).dialog({ 
     bgiframe: true, modal: true, autoOpen: false, closeOnEscape: false, 
     draggable: true, position: 'center', resizable: false, width: 400, height: 150 
    }); 


});

}

Fuente

2010-02-16 13:51:16 Zuber

¿Estás seguro de que uno y solo un div tiene la identificación "confirmación"? Los identificadores duplicados no están permitidos.

Fuente

2010-02-16 12:59:26 kgiannakakis

¿JQuery Dialog funciona solo con ID? ¿No podemos hacer algo como $ ('div.popup'). Dialog ({..})? A partir de ahora, estoy seguro de que la página tenía una sola "confirmación" – Zuber

La razón por la que lo está viendo eliminar #confirmation es porque $("#foo").dialog() moverá #foo desde donde se encuentre en el DOM a la parte inferior del documento dentro de los elementos del wrapper que crean el estilo del cuadro de diálogo que inicialmente están ocultos. Se entiende que los diálogos están ocultos hasta que se abren.

Fuente

2010-02-16 13:34:18

Gracias. Me di cuenta de eso. Creo que el problema es que estoy buscando div en mi 'actionContext'. Pero Jquery ha movido ese div ahora fuera del alcance. Entonces, ¿la identificación es la única forma de abrir el diálogo? – Zuber

La respuesta aprobada trabajó para mí también. Yo estaba usando:

$('.myLink').click(function(){ 
    $(this).next().dialog(...) 
});

y no estaba allí después de hacer clic la primera vez.

Ahora estoy usando el ID direcly:

$("#myId").dialog(...)

y, obviamente, no importa dónde se mueve de diálogo en la página, esto va a encontrarlo.

Fuente

2012-07-12 18:18:01 sigmapi13

en mi caso un simple 'return false;' en la función de hacer clic en el truco:

$("#buttonIdThatOpensTheDialogWhenClicked") 
     .button() 
     .click(function() { 
       $("#myDialog").dialog("open"); 
       return false; 
     }); 
    });

Fuente

2013-09-20 23:56:06 user88243

Jquery Dialog - div desaparece después de la inicialización

Respuesta

Cuestiones relacionadas