4

Buenos días. Ya había posteado anteriormente un problema con un formulario , pero sigo sin poder concluir este módulo. El problema es que cuando abro este Formulario Ajax (que se abre en un dialog y el div del mismo está fuera de cualquier otro formulario - está dentro del layout), agrego los datos y al hacer el submit pasa mas de 1 vez por la acción del controller (hasta 10 veces), como si se hubiese apretado el botón de submit muchas veces, y nunca me borra los datos de los textbox.

<div id='Div-AB-Email' style="display: none">
    <div id='Div-Email'></div>
</div>

JS:

function abrirFormEmail() {
    Preloader();
    preloaderBusquedas("Div-Email");

    $("#Div-AB-Email").dialog({
        autoOpen: true,
        open: function (event, ui) {
            $("#Div-Email").load("/EmailPersona/Create");
            $("#Mail").val("");
            $("#Observaciones").val("");

        },
        focus: function (event, ui) { $("#Mail").focus(); },
        show: {
            effect: "blind",
            duration: 500,
        },
        hide: {
            effect: "blind",
            duration: 500
        },
        width: 1036,
        height: 400,
        title: "Email de contacto ",
        closeOnEscape: true,



    });

    PreloaderOff();
}

C#:

 public class EmailPersonaController : BaseController
{



    public PartialViewResult Create()
    {
        return PartialView();
    }



    [HttpPost]
    public PartialViewResult Create(EmailPersonaModel model)
    {
        if (model == null)
            return PartialView();

        if (model.IdPersona == 0)
        {

            model.IdPersona = ConsultaIdPersona();
            ModelState.Remove("IdPersona");
        }


        try
        {
            if (ModelState.IsValid)
            {

                if (model.Nuevo())
                {
                    model.grabado = true;
                    ListItemsCarga().Add(model);
                    var modelnull = new EmailPersonaModel();
                    return PartialView(modelnull);
                }

                else
                {
                    return PartialView(model);
                }
            }
            else
            {
                if (string.IsNullOrEmpty(model.Mail))
                    TempData["ErrorEmail"] = "Debe escribir el mail que desea agregar a la lista";
            }
            return PartialView(model);
        }
        catch (Exception e)
        {
            if (e.Message == "ERROR: 23505: llave duplicada viola restricción de unicidad «uq_email_per»")
            {

               TempData["ErrorEmail"] = "El Mail que quiere cargar pertenece a otra persona";
            }

            return PartialView();
        }
    }
}

Razor:

@model QBOWEB3.Models.EmailPersonaModel
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
@{
    ViewBag.Title = "Create";
}

@using (Ajax.BeginForm("Create", "EmailPersona",
new AjaxOptions
{
    HttpMethod = "POST",
    InsertionMode = InsertionMode.Replace,
   UpdateTargetId = "Div-Email"


}))  
{

    <fieldset>


            <h3>Email De Contacto</h3>
            <span>@ViewBag.Afiliado</span>
            @Html.AntiForgeryToken()
            @Html.ValidationSummary(true)


            <legend>EmailPersonaModel</legend>



        <div id="contenidoEmail">

            <table class="TableCampsEdicion">

                <tr>

                    <td class="tdLabel">
                        @Html.LabelFor(model => model.Mail)
                    </td>

                    <td class="tdTextBox">
                        @Html.EditorFor(model => model.Mail)

                    </td>

                    <td class="tdLabel">


                        @Html.LabelFor(model => model.Observaciones)
                    </td>

                    <td class="tdTextBox">
                        @Html.EditorFor(model => model.Observaciones)

                    </td>

                    @Html.EditorFor(model => model.IdPersona)

                    <td class="tdTextBox">
                        <input type="submit" value="Agregar" class="botonAzulMediano" style="width: 95px; margin-left: 10px;" />

                    </td>
                </tr>
                <tr>
                    <td class="tdTextBox" colspan="5">
                        @Html.ValidationMessageFor(model => model.Mail)
                        @Html.ValidationMessageFor(model => model.Observaciones)
                    </td>
                </tr>
            </table>


        @*    <div id="itemsEmail">@Html.Action("Index")</div>*@

            @if (@TempData["ErrorEmail"] != null && @TempData["ErrorEmail"].ToString() != "")
            {
                <script>
                    $(function () {

                        mensaje("@TempData["ErrorEmail"]");


                    });
                </script>
            }
            @if (Model != null && Model.grabado)
            {
                <script>
                    $(function () {

                        $("#Mail").val("");
                        $("#Observaciones").val("");



                    });

                </script>



            }

            <script>
                $(function () {
                    $("#Mail").focus();
                    Enter_por_Tab();
                    PreloaderOff();


                })


            </script>
        </div>
    </fieldset>
}
7
  • entiendo que el view que nos muestras seria el partialview que se inyecta en el div del popup, no ? Si es asi la view principal donde esta esta partial tiene otro tag form, o sea hay forms anidados? porque si el div del popup define un form que hace submit y esta dentro de otro form de la view principal puede traer problemas Commented el 3 feb. 2016 a las 14:40
  • con que browser estas realizando la prueba? porque me sucedio algo parecido pero cuando depuraba desde el VS usando el IE, si cambio de browser ya no sucedia Commented el 3 feb. 2016 a las 14:43
  • La view principal tiene un Form. Pero el div del popUp lo coloque en el layout bien abajo, Debajo del footer. Estoy probando con FirefoxDeveloper Commented el 3 feb. 2016 a las 14:46
  • También probé con Chrome Commented el 3 feb. 2016 a las 14:52
  • no evaluaste no usar Ajax.BeginForm y cambiarlo por $.ajax de jquery ? o sea invocar el action pero enviando los datos sin post al action, sino con una llamada ajax enviando json Commented el 3 feb. 2016 a las 14:52

1 respuesta 1

4

Como propuse en los comentarios se podria intentar cambiando e Ajax.BeginForm por una invocacion que use $.ajax de jquery.

Para enviar el form se podria usar el .serialize() de jquery sobre el form

Web API With AJAX: Submit Form Data After Serialization

En el ejemplo se observa que usa data: $('#form1').serialize(), para enviar los datos del form al action del controller

$("#Save").click(function () {
        $.ajax({
            url: '@Url.Action("NombreAction")',
            type: 'POST',
            dataType: 'json',
            data: $('#form1').serialize(),
            success: function (data, textStatus, xhr) {
                console.log(data);
            },
            error: function (xhr, textStatus, errorThrown) {
                console.log(textStatus);
            }
        });
});

Pero no defienas un Ajax o Html BeginForm en el partialview, sino usa el tag form como html.

>>En la acción create del controller ¿que debería retornar?

El retorno depende, algunos devuelven un json o un HttpStatusCodeResult indicando un Ok de http Pero tambien podria ser un void o un valor simple como string o bool

1
  • En la acción create del controller ¿que debería retornar?. Lo estoy probando. Llega al método create, el Model llega bien. pero al retornar al método de Ajax entra en error. Imagino que es por el retorno Commented el 3 feb. 2016 a las 16:14

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.