none
Problemas al cargar datos en la ventana modal? Ajax y Jquery RRS feed

  • Pregunta

  • Buenos dias,

    Mi problemas es el siguiente, espero me entiendan, Trabajo con mvc , cuando entro a mi aplicacion y voy a mi modulo llamado seriales hay una Busqueda con un boton, le doy click y me trae la ventana MODAL en blanco sin datos, la actualizo o le doy esc y vuelvo a darle click en la opcion de busqueda y alli si me trae los datos, tambien cuando me voy a otro modulo como crear activos y alli esta la misma busqueda que llama la misma funcion y le doy click .. de nuevo trae ventana en blanco, vuelvo y le actualizo o esc y vuelvo a darle click y alli si me trae los datos, eso pasa cuando cambio de modulos y hago las busquedas , en el primer click error, actualizo y segundo click  o.k me trae los datos. Ya he buscado mucho, unos me dicen que "Estoy utilizando el tipo de retorno Action Result en el lado del servidor, que cambie los metodos a JqueryResult"  OTROS me dicen que es la cache, Otros que llame los datos con Json.. esto lo he hecho pero nada. les voy a poner el codigo y la imagen del problema.. ESPERO ME AYUDEN.

    LA FUNCION: busca por producto o entidad.

     function buscaProducto(url, cod, name) {

            if (cod.length != 0 || name.length != 0) {
                var producto = name;
                var identidad = cod;
                $.ajax({

                    url: url,
                    type: "POST",
                    dataType: "html",
                    error: AjaxFailure,
                    beforeSend: AjaxBegin,
                    data: { productoNombre: producto, identidad: identidad },
                    success: function (data) {
                        $("#dialog").dialog({
                            bigframe: true,
                            modal: true,
                            autoOpen: true,
                            width: 900,
                            heigth: 700,
                            resizable: false
                        });
                        $("#progressbar").hide();
                        $("#dialog").html(data);
                        console.log("Entregó los datos al #dialog");
                    }

                });
            }
            else {
                alert("<p>Debe ingresar una opcion de busqueda</p>", $(window).height() / 3)
                this.abort();
            }
        }

    EL CONTROLADOR: Encargado de hacer mi parte logica 

    [HttpPost]
            public ActionResult BusquedaProducto(string productoNombre, string identidad)
            {
                if (productoNombre.Equals(""))
                {
                    if (identidad.Equals(""))
                    {
                        return HttpNotFound();
                    }
                    else
                    {
                        var code = (from p in db.GN_Portafolio
                                    where p.CodigoPortafolio.StartsWith(identidad) && p.SenSerial == true
                                    select p).ToList();
                        if (code.Equals("0"))
                        {
                            return HttpNotFound();
                        }
                        else
                        {
                            return View(code);
                        }
                    }
                }
                else
                {
                    var producto = (from p in db.GN_Portafolio
                                    where p.NombrePortafolio.StartsWith(productoNombre)
                                    select p).ToList().Take(100);
                    if (producto.Equals("0"))
                    {
                        return HttpNotFound();
                    }
                    else
                    {
                        return View(producto);
                    }
                }

            }

    LA VISTA CREAR: Aqui es donde me pinta el HTML

    <div class="separadores">
                <div class="flota">
                    <div class="editor-label">
                        @Html.LabelFor(model => model.GN_Portafolio_CodigoPortafolio)
                    </div>
                    <div class="editor-field">
                        @Html.TextBoxFor(model => model.GN_Portafolio_CodigoPortafolio, new { placeholder = "Codigo", @class = "text-box single-line" })
                        @Html.ValidationMessageFor(model => model.GN_Portafolio_CodigoPortafolio, "", new { @class = "validate" })
                        <div id="com"></div>
                    </div>
                </div>
                <div class="flota">
                    <div class="editor-field-largo">
                        <p class="space"></p>
                        <input id="nombrePortafolio" type="text" name="nombrePortafolio" placeholder="Nombre" />
                        <input id="cargarPortafolio" class="buscar" type="button" value=" "onclick="buscaProducto('@Url.Action("BusquedaProducto","LO_Serial")',$('#GN_Portafolio_CodigoPortafolio').val(),$('#nombrePortafolio').val());" />
                    </div>
                </div>
            </div>

    y FINALMENTE MI VISTA Busqueda Producto que es la encargada de llevar los datos.

    @model IEnumerable<SifActivoFijo.Models.GN_Portafolio>

    <form class="items">
        <label>items por Pagina: </label>
        <select>
            <option>5</option>
            <option>10</option>
            <option>15</option>
        </select>
    </form>
    <input name="button" type="button" onclick="$('#dialog').dialog('close');" value="Cerrar" />
    <table  class="tablas">
        <thead>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.CodigoPortafolio)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.NombrePortafolio)
                </th>
                <th></th>
            </tr>
        </thead>
        <tbody id="pagina">
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.CodigoPortafolio)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.NombrePortafolio)
                    </td>
                    <td>
                        <input class="seleccion" type="button" value="Seleccionar" />


                    </td>
                </tr>
            }
        </tbody>
    </table>
    <div class="holder"></div>
        <script type="text/javascript">
            $(document).ready(function () {

                $('input.seleccion').click(function () {
                    var codigo = $(this).parent().prev().prev();
                    var nombre = $(this).parent().prev();
                    $('#GN_Portafolio_CodigoPortafolio').val($.trim(codigo.text()));
                    $('#nombrePortafolio').val($.trim(nombre.text()));
                    document.getElementById("dialog").innerHTML = '<div id="progressbar" class="progressbar" style="display: none;"></div>';
                    $("#dialog").dialog('close');
                });
            });

    Aqui se muestra como al segundo click en el boton trae perfecto los datos 

    pimer click o cambio de modulo y aparece esto



    erikpugo

    jueves, 13 de noviembre de 2014 15:31

Todas las respuestas

  • hola

    algo que recomendaria es que el BusquedaProducto() retiene un PartiaView y no un View como haces ahora

    tambien noto muchos if en el codigo, si puedes hacer

    if (productoNombre.Equals("") && identidad.Equals("")){
    
       return HttpNotFound();
    
    }
    
    //resto codigo

    no necesitas unir tantos if

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 13 de noviembre de 2014 16:00
  • Sigue lo mismo Leandro, sabes que me di cuenta, que el problema es cuando trae la ventana modal, la puse a pintar sin la ventana modal y puse  appendTo: "#aspnetFor", y me trae los datos perfecto al primer click, el problema es como hacer para que mi ventana se muestre en el centro y no abajo.. revisa la función y mira que puedo hacer para centrarla

       

    function buscaProducto(url, cod, name) {

            if (cod.length != 0 || name.length != 0) {
                var producto = name;
                var identidad = cod;
                $.ajax({

                    url: url,
                    type: "POST",
                    dataType: "html",
                    error: AjaxFailure,
                    beforeSend: AjaxBegin,
                    data: { productoNombre: producto, identidad: identidad },
                    success: function (data) {
                        $("#dialog").dialog({
                            bigframe: true,
                            //modal: true, QUITE ESTO
                            autoOpen: true,
                            width: 900,
                            heigth: 700,
                            appendTo: "#aspnetFor",  AGREGUE ESTO
                            resizable: false
                        });
                        function showDialog(id) {             AGREGUE ESTO
                            $('#' + id).dialog("open");
                        }

                        function closeModalDiv(id) {               AGREGUE ESTO
                            $('#' + id).dialog("close");
                        }
                        var dz = $(".ui-front").css("z-index")         AGREGUE ESTO
                        $(".ui-widget-overlay").css({ "z-index": dz - 1 });     AGREGUE ESTO
                        $(".ui-widget-overlay").appendTo($("form:first"));      AGREGUE ESTO
                        $("#progressbar").hide();
                        $("#dialog").html(data);
                        console.log("Entregó los datos al #dialog");
                    }

                });
            }
            else {
                alert("<p>Debe ingresar una opcion de busqueda</p>", $(window).height() / 3)
                this.abort();
            }
        }


    erikpugo

    jueves, 13 de noviembre de 2014 16:42