0

Hola amigos intento hacer los siguiente.

Tengo una pagina con una serie de Tabs, cada Tab puede crear un Dialogo que carga por AJAX el contenido de un formulario (http://localhost/catalogos/cliente/ este formulario se mostrara para cada Tab que lo abra), cada ves que guarde los datos del formulario debo regresar un valor al tab que lo abrió algo así como un callback.

Espero algún comentario , gracias.

JS que se llama al abrir un nuevo tab "tab-opcion.js"

(function ($, App, url) {
    "use strict";
    $(function () {

        $('.buscar-cliente' + idDynamic).on('click', function () {

            $("#modalCliente" + idDynamic).dialog({
                title: 'Partes',
                closed: false,
                cache: false,
                href: "http://localhost/catalogos/cliente/",
                queryParams: {cliente: value},
                modal: true,
                inline: true,
                onBeforeOpen: function () {
                    $("#modalNuevaParte" + idDynamic).dialog('center');
                }
            }); 
        });

    });
}(jQuery, App, url));

JS que se carga al llamar al formulario via ajax (cliente.js)

(function ($, App, url) {
    "use strict";
    $(function () {

        //Code.....

        $('#guardarCliente' + idDynamic).on('click', function (e) {
             //codigo para guardar datos....

            // Como puedo regresar un valor ala pagina del tab-opcion.js ???? 
        });

    });
}(jQuery, App, url));

1 respuesta 1

1

Cuando invoques al dialog en tab-opcion.js agregale callback close Ej:

$( "#dialog" ).dialog({
  close: function( event, ui ) {
    //Codigo aqui
    var valorObtenidoDelModal = $(this).data('valorInputModal');
    $("#lblResult").text(valorObtenidoDelModal);
  }
});

Después en cliente.js luego de que guardes satisfactoriamente le seteas al dialog el valor que obtuviste para luego utilizarlo en el evento close del mismo.

dialg.data("valorInputModal", modalInput.val());

//Este seria el js1
$(function() {
  $("#lblResult").text("nada");

  $("#btnMostrar").click(function() {
    $("#dialog").dialog({
      close: function(event, ui) {
        var valorObtenidoDelModal = $(this).data('valorInputModal');
        $("#lblResult").text(valorObtenidoDelModal);
      }
    });
  })
});

//Este seria el js2
$(function() {
  var dialg = $('#dialog'); //Este se corresponde con el dialog, si bien son archivos js distintos, estan referenciados en el mismo HTML por lo cual se puede llegar al DOM y obtener este elemento.
  $("#txtModalInput").change(function(evt) {
    evt.lala = 3;
    var modalInput = $(this); //Este se corresponde con el modalInput
    dialg.data("valorInputModal", modalInput.val());
  });
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<input id="btnMostrar" type="button" value="mostrar dialogo" />
<br />
<br /> Valor seleccionado en el dialog:<br />
<span id="lblResult"></span>

<div id="dialog" title="Basic dialog" style="display:none;">
  Ingrese un valor y luego cierre el dialogo.
  <input type="text" id="txtModalInput" />
</div>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.