asp.net mvc Ajax.BeginForm клон

Question

Я использую asp.net mvc ajax.

Частичное представление использует Ajax.BeginForm (просто пример):

<div id="divPlaceholder">
<% using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "divPlaceholder" })) { %>
     ... asp.net mvc controls and validation messages
     <input type="submit" value="Save" />
<% } %>
</div>

После обновления, если проверка не пройдена,html:

<div id="divPlaceholder">
    <div id="divPlaceholder">
    ...form
    </div>
</div>

Мне не нравится, что возвращенный html вставляется, вместо этого он должен заменить оригинальный div.

Вероятно, на POST я не должен отображать <div> вокруг формы вчастичное представление или рендеринг div без идентификатора.

Что еще я могу сделать в этой ситуации?

Я думал, что, возможно, мне следует написать помощник, что-то вроде Ajax.DivBeginForm, который будет рендеритьсоздать внутри div на GET и скрыть div на POST.

Может кто-нибудь дать хороший совет, как написать такой помощник (Ajax.DivBeginForm)?

Я бы хотел, чтобы он работал с использованием ключевого слова:

<% using (Ajax.DivBeginForm(new AjaxOptions { UpdateTargetId = "myId" })) { ... }%>

Answer 1

Я собираюсь использовать здесь немного другой подход, вместо того, чтобы заставить ваше оригинальное решение работать, я бы рекомендовал использовать шаблон, обычно используемый в этом сценарии, а не помощника. Я понимаю, что это немного позже, чем оригинальный пост, но для дальнейшего использования любым:)

Если ваше частичное представление имеет форму, то вы будете продолжать публиковать и возвращать форму в форме в форме в форме и т. Д., Поэтому вы хотите, чтобы ваш PARENT содержал BeginForm, div и renderpartial

using (Ajax.BeginForm("Index", "ProjectManager", new AjaxOptions() ....
<div id="divPlaceholder">
     Html.RenderPartial(....)
</div>

Если вы хотите инкапсулировать эту логику в, скажем, частичное представление «Заказ», которое отображается на экране «Клиент», то у вас есть два варианта. 1. Включите BeginForm в родительское представление Customer (которое уменьшает возможность многократного использования кода, поскольку любое представление, которое хочет включить частичное представление "Order", должно включать ajax-подключение. Или же 2. У вас есть два частичных представления для заказа. Одним из них является OrderIndex.ascx (или cshtml, если бритва), а другим - OrderIndexDetail.ascx (или любое другое соглашение об именовании, которое вы решите)

OrderIndex содержит ваш Ajax.beginform, а OrderIndexDetail не имеет формы, только детали частичного просмотра.

Вариант 2 - это больше кода (хорошо, буквально около 30 секунд кода, чтобы переместить ajax.beginform в другое представление), но увеличивает возможность повторного использования кода.

Answer 2

Мое решение. Пожалуйста, прокомментируйте, если что-то не так.

public class DivMvcForm : MvcForm
{
    private bool _disposed;
    private MvcForm mvcForm;
    private ViewContext viewContext;

    public DivMvcForm(MvcForm mvcForm, ViewContext viewContext) : base(viewContext)
    {
        this.mvcForm = mvcForm;
        this.viewContext = viewContext;
    }

    protected override void Dispose(bool disposing)
    {
        if (!_disposed)
        {
            _disposed = true;

            mvcForm.EndForm();

            viewContext.Writer.Write("</div>");
        }
    }
}

Помощник

public static class AjaxHelperExtensions
{
    public static MvcForm DivBeginForm(this AjaxHelper ajaxHelper, AjaxOptions ajaxOptions)
    {
        var tagBuilder = new TagBuilder("div");

        if (ajaxHelper.ViewContext.HttpContext.Request.RequestType == "GET" 
            && string.IsNullOrWhiteSpace(ajaxOptions.UpdateTargetId) != true)
        {
            tagBuilder.MergeAttribute("id", ajaxOptions.UpdateTargetId);
        }

        ajaxHelper.ViewContext.Writer.Write(tagBuilder.ToString(TagRenderMode.StartTag));

        var theForm = ajaxHelper.BeginForm(ajaxOptions);

        return new DivMvcForm(theForm, ajaxHelper.ViewContext);
    }
}

И как это работает

<% using (Ajax.DivBeginForm(new AjaxOptions { UpdateTargetId = "divPlaceholder" })) { %>
    ... controls
<% } %>

Результат - когда ModelState недействителен, частичное представление возвращает div без идентификатора.

Answer 3

Вы можете самостоятельно отправить форму:

<div id="divPlaceholder">
<% using (Html.BeginForm("action", "controller", FormMethod.Post, new { id = "submitForm"})) { %>
     ... asp.net mvc controls and validation messages
     <input type="submit" value="Save" />
<% } %>
</div>

и написать некоторый javascript как:

$('#submitForm').submit(function() {
   $.post('post-to-this-url', 
      data: { foo: formvalue1, bar: formvalue2},
      function(data) {
      // update html here
   }); 
   return false;
})