Ajax.BeginForm копирует, когда модель недействительна

Question

Я пишу PartialView Ajax.BeginForm. Этот частичный составлен список сообщений и поле, чтобы отправить новое сообщение, как показано на рисунке ниже:

Частичное имеет следующий код:

код этого списка сообщений

@if (Model != null) 
{ 

    <div class="chat-activity-list" id="listaMensagens"> 
    @foreach (Inspinia_MVC5.Models.PostComentarios comentario in Model.Where(c => c.Usuarios.UsuEmail.Contains(User.Identity.Name) || (c.Usuarios.UsuId == c.Post.UsuId && (c.UsuariosDestinatario != null && c.UsuariosDestinatario.UsuEmail.Contains(User.Identity.Name)))).ToList()) 
    { 
     <div class="chat-element @(comentario.UsuId == comentario.Post.UsuId ? "right" : "")"> 
      <a class="@(comentario.UsuId == comentario.Post.UsuId ? "pull-right" : "pull-left")" href="#"> 
       <img src="/Servicili/Images/a2.jpg" class="img-circle" alt="image"> 
      </a> 
      <div class="media-body @(comentario.UsuId == comentario.Post.UsuId ? "text-right" : "")"> 
       <small class="@(comentario.UsuId == comentario.Post.UsuId ? "pull-left" : "pull-right") text-navy">@Inspinia_MVC5.Helpers.DateHelper.getTempo(comentario.PosComDataEnvio)</small> 
       <i class="fa fa-star @(comentario.UsuId == comentario.Post.UsuId ? "text-success" : "text-warning") "></i> 
       <strong>@comentario.Usuarios.Clientes.CliNome</strong> 
       <p class="m-b-xs"> 
        @comentario.PosComComentario 
       </p> 
       <small class="text-muted">@comentario.PosComDataEnvio</small> 
      </div> 
     </div> 
    } 
    </div> 
} 
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script> 

код формы для отправки нового сообщения

<div class="chat-form"> 
    @using (Ajax.BeginForm("EnviarMensagem", "OrcamentosServicos", new AjaxOptions() { UpdateTargetId = "listaMensagens", InsertionMode = InsertionMode.InsertAfter })) 
    { 
     @Html.AntiForgeryToken() 
     @Html.ValidationSummary() 
     //@Html.HiddenFor(m => m.FirstOrDefault().Post.PostOrcamentoServico.FirstOrDefault().PosOrcSerId) 
     <div class="form-group"> 
      @Html.TextArea("PosComComentario", new { @placeholder = "Digite uma mensagem...", @class = "form-control" }) 
     </div> 
     <div class="text-right"> 
      <button type="submit" class="btn btn-sm btn-success m-t-n-xs">Enviar mensagem</button> 
     </div> 
    } 
</div> 

В мой контроллер у меня есть следующие методы:

Верните PartialView, которые будут оказывать эти комментарии (PostComentarios)

public PartialViewResult EnviarMensagem(HashSet<PostComentarios> lComentarios) 
{ 
    return PartialView(lComentarios); 
} 

для [сообщение] метод, У меня есть следующий код:

[HttpPost] 
public PartialViewResult EnviarMensagem(PostComentarios comentario/) 
{ 
    if (string.IsNullOrEmpty(comentario.PosComComentario)) 
    ModelState.AddModelError("PosComComeentario", "Informe um texto para enviar a mensagem."); 
    if (ModelState.IsValid) 
    return PartialView("ListaMensagens"); 
    else 
    return PartialView(); 
} 

И у меня есть еще один частичный вид, который используется только для отображения нового сообщения под названием ListaMensagens ...

Моя проблема заключается в том, что, когда я пытаюсь использовать Validation, система дублирует основную форму, как показано ниже :

Может кто-нибудь сказать мне, что я делаю неправильно?

Answer 1

Из того, что я вижу, вы используете режим ввода InsertionMode.InsertAfter, что означает, что результаты метода Action будут вставлены после существующих данных в форме.

if (ModelState.IsValid) 
    return PartialView("ListaMensagens"); 
else 
    return PartialView(); 

В том случае, если ваша модель не действует, вы возвращаете весь Partial View, который вставляется после существующих элементов в форме. Это приводит к размещению всей дополнительной копии частичного представления после вашего существующего, дублирования всего в нем, включая текстовое поле и кнопку.