Eliminar datos del cuadro de diálogo de JQuery cuando lo cierro

Tengo el cuadro de diálogo JQuery para insertar una nueva fila en la tabla. Y todo funciona bien Hace unos días, cuando inserté FlexiGrid for Table, empecé a tener un problema. Cuando inserto el cuadro de diálogo de nueva fila desaparecer pero cuando abro el cuadro de diálogo para insertar nuevos datos que se insertan antes todavía está en el cuadro de diálogo.Eliminar datos del cuadro de diálogo de JQuery cuando lo cierro

Cómo restablecer los campos de diálogo después de que termine con su uso.

El código para el diálogo es la siguiente:

$(function() { 
    $("#dialog:ui-dialog").dialog("destroy"); 
     $("#newDialog-form").dialog({ 
      autoOpen: false, 
      height: 250, 
      width: 300, 
      modal: true, 
      buttons: { 
       Salva: function() { 
        $.ajax({ 
         url: 'agendaTipoAppuntamentoSaveJson.do', 

         type: "POST", 
         dataType: "json", 
         data: $("#newDialogForm").serialize(), 
         success: function(result) { 
          if (result.esito!='OK') { 
           alert(result.esito + ' ' + result.message); 
          } 
          else { 
           addNewTipoAppuntamento(
              result.insertedTipoApp.idTipoAppuntamento , 
              result.insertedTipoApp.codice, 
              result.insertedTipoApp.descrizione, 
              result.insertedTipoApp.descrBreve, 
              result.insertedTipoApp.colore 
          ); 
          $("#newTable").flexReload(); 
          $("#newDialog-form").dialog('close'); 
          } 
         }, 
         error:function (xhr, ajaxOptions, thrownError){ 
          alert(xhr.status); 
          alert(thrownError); 
         } 
        }); 
       }, 
       Annula : function() { 
        $(this).dialog("close"); 
       } 
       } 
     }); 

     $("#newDialog-form").dialog({ closeText: '' }); 
});

Ésta es la forma de diálogo:

<div id="newDialog-form" title="Nuovo Tipo Appuntamento" class="inputForm" > 
    <form id="newDialogForm" action="agendaTipoAppuntamentoSaveJson.do" > 
    <input type="hidden" name="azione" id="idAzione" value="update" /> 
    <input type="hidden" name="idTipoAppuntamento" id="idTipoAppuntamentoIns" value="-1" /> 
    <fieldset> 
     <table> 
      <tr > 
      <td> 
      <label for="codiceIns">Codice </label> 
      </td><td> 
      <input type="text" name="codice" id="codiceIns" class="text ui-widget-content ui-corner-all"/> 
      </td></tr><tr> 
      <td> 
      <label for="descrizioneIns">Descrizione </label> 
      </td><td> 
      <input type="text" name="descrizione" id="descrizioneIns" value="" class="text ui-widget-content ui-corner-all" /> 
      </td></tr><tr> 
      <td> 
      <label for="descrBreveIns">descrBreve </label> 
      </td><td> 
      <input type="text" name="descrBreve" id="descrBreveIns" value="" class="text ui-widget-content ui-corner-all" /> 
      </td></tr><tr> 
      <td> 
      <label for="coloreIns">colore </label> 
      </td><td> 
      <input type="text" name="colore" id="coloreIns" value="" class="text ui-widget-content ui-corner-all" /> 
      </td> 
      </tr> 
     </table> 
    </fieldset> 
    </form> 
</div>

Fuente

2012-01-23 Akosha

'Cómo restablecer los campos de diálogo después de que termine con su uso' ¿Puede explicar con más detalle –

Solo quiero borrar los datos de los campos del formulario cuando presiono Guardar od Cancelar en el formulario, así que cuando lo abra de nuevo tengo claro formulario y no forma con datos previos – Akosha

Verificar Dialog Close evento. Necesitará almacenar el estado del diálogo, el estado incluirá (título, texto, etc.) si lo está modificando.

actualización

Después de leer el comentario, lo que tengo, dando respuesta de acuerdo con ella. Por favor corrígeme si estoy equivocado.

Antes de abrir el formulario de dailog, almacene el html en la variable local y luego, antes de cerrarlo, vuelva a establecer el html en el diálogo.

var originalContent; 
$("#newDialog-form").dialog({ 
    //Your Code, append following code 
    open : function(event, ui) { 
     originalContent = $("#newDialog-form").html(); 
    }, 
    close : function(event, ui) { 
     $("#newDialog-form").html(originalContent); 
    } 
});

Espero que te ayude.

Fuente

2012-01-23 08:56:46

sí, eso ayuda ... Tengo un cuadro de diálogo claro ... – Akosha

Probé ese enfoque, y funciona bien en términos de restaurar la estructura html. Pero los ** eventos ** asociados a cualquier control en el cuadro de diálogo ** parecen estar perdidos ** porque no se guardan dentro de la estructura. Intentaré agregar una función adicional ApplyDialogEvents() al evento abierto del diálogo, para ver si eso ayuda. – Matt

Puede hacer uso de la close caso de los cuadros de diálogo jQuery.

Más información en jQuery UI.

p. Ej.

$("#newDialog-form").dialog({ 
    ... 
    close : function() { 
     //functionality to clear data here 
    } 
});

Fuente

2012-01-23 08:54:07 tobias86

Intentaré evitar escribir mi propia función para borrar datos en el diálogo ... Tal vez alguien tenga una solución para eso: S – Akosha

¿Funcionaría si agrega esta línea a la función de Guardar o Cancelar?

$("#newDialog-form").html("");

o más métodos recta (@mplungjan THX):

$("#newDialog-form").empty();

Esto hace que todo el contenido dentro del diálogo desaparece, que es la mejor manera para no parece que la última datos.

Fuente

2012-01-23 08:56:34 netadictos

¿por qué no usar [.empty()] (http: // jsperf. com/jquery-empty-vs-html])? – mplungjan

@mplungjan: o vacío() (lo agrego a mi respuesta. Thx), esa es otra solución directa, es que cualquier código que se piense, se puede resolver sin buscar métodos de diálogo. – netadictos

borra todo del diálogo. No más filas para insertar cuando lo abra la 2da vez. Lo mismo con html() y con empty() – Akosha

puede limpiar todo el contenido html en DIV configurando la propiedad html en nada.

$("#ElementId").html("");

Fuente

2012-01-23 11:24:18 Raathigesh

Por qué no crear el código HTML en el cuadro de diálogo cada vez que se abre y luego se hace esto:

$(this).dialog("close"); 
$(this).remove();

..after que haya terminado de introducir el nuevo registro, por lo general después

$('#yourForm').submit();

¡Salud!

Fuente

2015-06-19 09:39:24

Eliminar datos del cuadro de diálogo de JQuery cuando lo cierro

Respuesta

Cuestiones relacionadas