Partial view validation change current page

87 views Asked by At

I have page that uses a partial view for a contact form, and the contact form is validated (so when I don't provide a required field, it redirect me to specific layout I create for this partial.)

Here is how my page is laid out:

Last image is a blank_layout I created for my partial view because if I don't do it, it changes all content like navbar and other parts of the page.

View Model:

public class ContactoViewModel
{
    public IEnumerable<ProductosModel> ProductosListes { set; get; }

    public String Descripcion { get; set; }
    public String Id { get; set; }

    [Required(ErrorMessage = "Es necesario que ingrese su nombre")]
    public String Name { get; set; }

    [Required(ErrorMessage = "Es necesario que ingrese su correo")]
    [Email(ErrorMessage = "Ingrese un Email válido")]
    public String Email { get; set; }

    [Required(ErrorMessage = "Ingrese algún comentario por favor")]
    [MinLength(10, ErrorMessage = "Es necesario que ingrese al menos 10 caracteres")]
    public String Comments { get; set; }
}

Partial view:

@model DismedHmo.Models.ContactoViewModel

@{
    Layout = "~/Views/Shared/Blank_Layout.cshtml";
}
@*<link href="~/Content/bootstrap.css" rel="stylesheet" />
    <link href="~/Content/component.css" rel="stylesheet" />
    <link href="~/Content/default.css" rel="stylesheet" />*@
<div class="row">

     <!-- feedback -->
     <article class="feedback">
        @*<div class="title-contact">Deja un mensaje </div>*@

        @using (Html.BeginForm("Contact_Partial", "ContactModels",   FormMethod.Post))
        {
            <div class="title-margin">
                @*<h6>Campos Requeridos*</h6>*@
            </div>
            <div class="input-group">
                <div class="col-md-12">
                    <div class="relative">
                        <i class=" fa fa-user appointment-contact"></i>
                        <div class="contactlbl">
                            @Html.TextBoxFor(model => model.Name, new { @class = "form-control, txtboxexpand", @style = "width:100%", @placeholder = "Nombre*" })
                            @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
                        </div>   
                    </div>
                </div>
            </div>
            <div class="input-group">
                <div class="col-md-12">
                    <div class="relative">
                        <i class=" fa fa-envelope appointment-contact"></i>
                        <div class="contactlbl">
                            @Html.TextBoxFor(model => model.Email, new { @class = "form-control, txtboxexpand", @style = "width:100%", @placeholder = "Email*", @type = "email" })
                            @Html.ValidationMessageFor(model => model.Email, "", new { @class = "text-danger" })
                        </div>
                    </div>
                </div>
            </div>
            <div class="input-group">
                <div class="hidden-xs col-sm-12 col-md-12 col-lg-12">
                    <div class="relative">
                        <i class=" fa fa-align-left appointment-message"></i>
                    </div>
                    <div class="contactlbl">
                        @Html.TextAreaFor(model => model.Comments, new { @class = "form-control, txtareaexpand", @style = "width:100%", @placeholder = "Mensaje*" })
                        @Html.ValidationMessageFor(model => model.Comments, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
            <div class="input-group">
                <div class="col-xs-12 hidden-sm hidden-md hidden-lg">
                    <div class="relative">
                        <i class=" fa fa-align-left appointment-message"></i>
                    </div>
                    <div class="contactlbl">
                        @Html.TextAreaFor(model => model.Comments, new { @class = "form-control, txtareaexpandxs", @style = "width:100%", @placeholder = "Mensaje*" })
                        @Html.ValidationMessageFor(model => model.Comments, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
            <div class="form-group margen-btn">
                <div class="col-sm-12">
                    <input type="submit" value="Solicitar cotización" class="btn btn-contacto" />
                </div>
            </div>
        }
    </article>
</div>

Calling partial view on main page:

<div class="col-md-6">
    @Html.Action("Contact_Partial", "ContactModels")
</div>

Controller:

[HttpPost]
public ActionResult Contact_Partial(ContactoViewModel model)
{
    if (!ModelState.IsValid)
    {
        Danger("Su mensaje no fue enviado, porfavor intente de nuevo.");
        return View();
    }
    using (var emailService = new EmailService())
    {
        emailService.SetRecipient("[email protected]");
        emailService.Contacto(model.Name, model.Email, model.Comments);
        emailService.Send();
    }

    Success(string.Format("Tu mensaje ha sido enviado con exito."), true);
    return RedirectToAction("Productos", "Productos");
}
public ActionResult MensajeEnviado()
{
    return View();
}

I really want the validation page to be displayed where the contact form was. How can I do this?

0

There are 0 answers