Как я могу опубликовать данные из частичного представления в MVC? - PullRequest
Новая
       7

Как я могу опубликовать данные из частичного представления в MVC?

0 голосов
/ 27 сентября 2018

У меня есть основной вид и два частичных вида

  1. Индекс - главный вид
  2. _Details - частичный вид
  3. _Адрес - частичный вид внутри частичного вида Подробности

Указатель - основной вид 

    @model IndexViewModel
    @{
        Layout = "~/Views/Shared/_CodeLayout.cshtml";

    }

@Html.Partial("_Details", Model)

2._Детали - частичный вид 

     @model IndexViewModel
<div id="Detailsdiv">  



    @using (Html.BeginForm("_Details", "FS", FormMethod.Post, new
        {
            id =
              "frmFS",
            @class = "form-horizontal"
        }))
    { 

    <div class="row">
        <div class="col-lg-1 nopadding">
            <div class="col-lg-1 nopadding">
                @Html.LabelFor(m => m.User.Name):
            </div>
            <div class="col-lg-2">
                @Html.TextBoxFor(m => m.User.Name, new { @id = "txtName", @style = "width:140px;height:24px", @maxlength = "25" })
            </div>
        </div>
    </div>
  @Html.Action("_Address", "Shared", new { userId = Model.User.UserId })
        }
        <button type="button" value="Save" ID="btnSave"> Save </button>
        }
    </div>

3._Address- частичное представление 

@model AddressViewModel 

<div id="divAddress">

    @using (Html.BeginForm("_Address", "Shared", FormMethod.Post, new { id = "frmAddress", @class = "form-horizontal" }))
    {
<div class="row">
<div class="col-lg-1 nopadding">
                                    @Html.LabelFor(m => m.Address.AddressDesc):
                                </div>
                                <div class="col-lg-2">
                                    @Html.TextBoxFor(m => m.Address.AddressDesc, new { @id = "txtAName", @style = "width:140px;height:24px", @maxlength = "25" })
                                </div>
</div>
---
-
-
And some more 
  <button type="button" value="Save" ID="btnCreate"> Create </button>
</div>

}



   $('#btnCreate').click(function () {

                $("#ajax_loader").show();
                 var inputdata = $("#frmAddress").serialize();
                $.ajax({
                    url: '@Url.Action("CreateAddress", "Shared")',
                    type: 'POST',
                    cache: false,
                    data: inputdata
                }).done(function (result) {
                    $("#divAddress").html(result);
                    $("#ajax_loader").hide();
                });

        });

SharedConroller

Получить действие для адреса 

public ActionResult _ Address (short userId )
        {


}

public ActionResult CreateAdderess(AddressViewModel addressViewModel)
        {
Create address…………..
But AddressViewModel is coming null 
}
    }


public class AddressViewModel
{
    [Key]
    public decimal AddressId { get; set; }


    [DisplayName("Address Type")]

    public string Addr_Typ { get; set; }
    [DisplayName("Address Description")]
    [MaxLength(256)]
    public string Addr_Desc { get; set; }
    [DisplayName("City")]
    [MaxLength(30)]
    public string City_Nm { get; set; }

    [DisplayName("State")]
    [MaxLength(2)]
    public string State_Cd { get; set; }

    [DisplayName("Zip")]
    [RegularExpression(@"^\d{5}(?:[\-]?\d{4})?$", ErrorMessage = "Invalid Zip")]
    [MaxLength(10)]
    public string Zip { get; set; }
}

Работает обратная запись из _Details.Отправить обратно с адреса - частичное представление не работает.

Заранее спасибо

Ответы [ 2 ]

0 голосов
/ 29 сентября 2018

Вы можете иметь несколько форм на странице.Например, если у вас есть таблица со строками, где вы хотите удалить любую строку, вы создаете форму в ячейке таблицы в этой строке.Таким образом, удаление использует только один идентификатор для действия POST для удаления.

Я предлагаю вам разделить ваши частичные представления на их собственные формы, каждый из которых действует независимо.Единственная проблема заключается в том, что для обновления в одной форме требуется повторное отображение другой.Ваш внешний вид может справиться с этим лучше, чем частичный вид, пытающийся общаться.Очень просто вернуть результаты двух представлений в объекте JSON из действия и назначить HTML каждому соответствующему DIV, имеющему частичное представление

У вас есть два варианта первоначального заполнения вашего частичного.Если у вас есть что-то подобное в вашем главном представлении, при первой загрузке ваши детали HTML отображаются движком RAZOR в div.Это происходит из действия HTTP GET (при условии, что у вас есть отдельные для GET и POST) 

<div id="divYourPartial">
    @Html.Partial("_Details", Model)
</div>

Код, который я предложил в первом ответе, затем снова заполнит этот DIV, когда пользователь сохранит (POSTS) свои изменения.Вам больше нечего делать.

Вы также можете заполнить div при первой загрузке, используя JavaScript, как в моем первом ответе 

<div id="divYourPartial">
</div>

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

        @section Scripts
        {
            <script type="text/javascript">

function LoadData(){
$.ajax({
    url: '/YourController/YourAction/' + YourId,
    type: "get",
    success: function (result) {
    $("#divYourPartial").html(result);
    }
});
}


        $(function () {
// first time page load
LoadData()

    $("#divOuter").on("dblclick", function (event) {
    // when user double clicks an item, show it for editing
    // on an outer div awaiting an event to percolate up from a descendant, the target is not $(this)
    var target = $(event.target);

    // Your ajax here to load the div
        });
    });
    </script>
0 голосов
/ 27 сентября 2018

Я предполагаю, что у вас есть действия HTTP GET и HTTP POST, которые возвращают одно и то же частичное представление.Вам нужен DIV в родительском представлении, которое содержит частичное представление 

<div id="divYourPartial"></div>

При загрузке (или изменении значения идентификатора на странице) данные загружаются в частичное представление из действия HTTP GET.Операция POST обрабатывается самим частичным представлением с использованием элемента Ajax.BeginForm 

$.ajax({
    url: '/YourController/YourAction/' + YourId,
    type: "get",
    success: function (result) {
    $("#divYourPartial").html(result);
    }
});

Частичное представление может выглядеть следующим образом.Обратите внимание, что целью обновления является внешний div, внутри которого находится это представление, но это работает с использованием опции «InsertionMode.Replace».Ваши действия (с одинаковыми именами) get и post возвращают это частичное представление с любой моделью, которую вы используете 

@model YourModels.ModelView
@{
    Layout = null;
}

@using (Ajax.BeginForm("YourAction", "YourController",
            new AjaxOptions
            {
                HttpMethod = "POST",
                InsertionMode = InsertionMode.Replace,
                UpdateTargetId = "divYourPartial"
            }))
{
    @Html.AntiForgeryToken()
    @Html.HiddenFor(m => m.YourId)

    @Html.ValidationSummary(false, "", new { @class = "text-danger" })

    <div>
        @Model.SomeInfo
    </div>

    <div class="form-group mt-1">
        @Html.LabelFor(model => model.Notes, htmlAttributes: new { @class = "control-label" })
        @Html.TextAreaFor(model => model.Notes, new { @class = "form-control", @rows = 6, @cols = 80 })
        @Html.ValidationMessageFor(model => model.Notes, "", new { @class = "text-danger" })
    </div>
    <input type="submit" value="Save" class="btn btn-default btn-primary" title="Save changes to these notes" />
}
...