Как сделать частичное представление из Json в Mvc 5 с помощью XmlHttpRequest

Question

в HTML

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

    $(document).ready(function() {

        $('#bSubmit').click(function(event) {
            event.preventDefault();

            var formData = new FormData();
            formData.append('@Html.Get__RequestVerificationTokenString()', '@Html.GetAntiForgeryToken()');
            formData.append('request.MessageId', @Model.MessageId);
            formData.append('request.Message', $('#Message').val());

            var xmlHttpRequest = new XMLHttpRequest();
            if (!window.XMLHttpRequest) {
                xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
            }

            xmlHttpRequest.open("POST",
                '@Url.Action("Send", "Page", new {area = "Question"})',
                true);

            xmlHttpRequest.onloadend = function() {
                var response = JSON.parse(xmlHttpRequest.responseText);

                $('#prButton').removeClass("visible");
                $('#prButton').addClass("invisible");

                switch (response.Type) {
                case 10:
                    LOG(response.PartialView);

                    $('#layoutSingleMessageItems .card-box').replaceWith(response.PartialView);
                    break;
                case -13:
                    @Html.ShowAlert("خطا در ارسال اطلاعات!");
                    break;
                }
            };

            xmlHttpRequest.send(formData);

        });

    });

</script>
}
<div class="row">

    <div class="col-md-7">
        @Html.Partial("Par_SingleMessageItem", Model.SingleMessageItems)
    </div>

<div class="col-md-5">
    <div class="card-box">
        <form>
            @Html.AntiForgeryToken()
            <div class="form-group col-md-12">
                <label class="col-form-label">پاسخ</label>
                <textarea rows="8" id="Message" placeholder="لطفا پاسخ خود را وارد کنید ..."></textarea>

            </div>

            <div class="form-group col-md-12 m-t-10">

                <button id="bSubmit" type="submit">
                    ارسال پاسخ

                </button>
            </div>

        </form>

    </div>
</div>

в частичном представлении (Par Single Item Message)

@model List<_4Wheels.Areas.Question.Models.SingleMessage.SingleMessageItem>

<div id="layoutSingleMessageItems" class="card-box">
    <div class="card-box">
        @{
            foreach (var item in Model)
            { 
                //code
            }
         }
   </div>
</div>

в контроллере

[HttpPost]
public ActionResult Send() {
   /*
      items = list object
   */

   return Json(new SendAnswerResponse {
       Type = 10,
       SingleMessageItems = PartialView("Par_SingleMessageItem" , items)
   });
}

в SendAnswerResponse

public class SendAnswerResponse : MvcResponse
{
    public PartialViewResult SingleMessageItems { get; set; }
}

Весь этот код работает нормально, но $('#layoutSingleMessageItems .card-box'). replaceWith(response.PartialView); он не работает, он не делает никаких ошибок. Возвращает нужный PartialView , только тег не обновляется.

Я даже поместил его в Console.log (response.Partial View), чтобы отобразить это сообщение

Модель: (5) […] 0: Объект {Сообщение: "fdgdfgdfg", Имя пользователя: "", Дата сообщения: "1398-08-06 23:01:11",…} 1: Объект {Сообщение: "dsafd", Имя пользователя: "", Дата сообщения: "1398-08-07 08:34:19",…} 2: Объект {Сообщение: "vcgdsafd", Имя пользователя: "", Дата сообщения: "1398-08-07 08:34:58",…} 3: Объект {Сообщение: "fdgfdg", Имя пользователя: "", Дата сообщения: "1398-08-07 08:42:43",…} 4: Объект {Сообщение: "fdgfdg", Имя пользователя: "", Дата сообщения: "1398-08-07 08:42:54",…} длина: 5 : Array [] TempData: Array [] Вид: ноль ViewBag: Object {} ViewData: [] длина: 0 : Array [] ViewEngineCollection: Array [{…}] ViewName: "Par_SingleMessageItem" : {…} defineGetter : функция defineGetter () defineSetter : функция defineSetter () lookupGetter : функция lookupGetter () lookupSetter : функция lookupSetter () <Сильный> прото : конструктор: функция Object () hasOwnProperty: функция hasOwnProperty () isPrototypeOf: функция isPrototypeOf () propertyIsEnumerable: функция propertyIsEnumerable () toLocaleString: функция toLocaleString () toSource: функция toSource () toString: функция toString () valueOf: функция valueOf () : функция прото () : функция прото () Utility.js: 13: 13

javascript asp.net-mvc-5 controller xmlhttprequest partial-views

0

user11657764 29 Окт 2019 в 00:07

Answer 1

Обновлено с помощью следующего кода PartialView

public static string RenderPartialViewToString(ControllerContext context, string viewPath, object model = null, bool partial = false)
        {
            // first find the ViewEngine for this view
            ViewEngineResult viewEngineResult = null;
            if (partial)
                viewEngineResult = ViewEngines.Engines.FindPartialView(context, viewPath);
        else
            viewEngineResult = ViewEngines.Engines.FindView(context, viewPath, null);

        if (viewEngineResult == null)
            throw new FileNotFoundException("View cannot be found.");

        // get the view and attach the model to view data
        var view = viewEngineResult.View;
        context.Controller.ViewData.Model = model;

        string result = null;

        using (var sw = new StringWriter())
        {
            var ctx = new ViewContext(context, view, context.Controller.ViewData, context.Controller.TempData, sw);
            view.Render(ctx, sw);
            result = sw.ToString();
        }

        return result;
    }

    public static T CreateController<T>(RouteData routeData = null) where T : Controller, new()
    {
        // create a disconnected controller instance
        T controller = new T();

        // get context wrapper from HttpContext if available
        HttpContextBase wrapper;
        if (System.Web.HttpContext.Current != null)
            wrapper = new HttpContextWrapper(System.Web.HttpContext.Current);
        else
            throw new InvalidOperationException("Cannot create Controller Context if no active HttpContext instance is available.");

        if (routeData == null)
            routeData = new RouteData();

        // add the controller routing if not existing
        if (!routeData.Values.ContainsKey("controller") &&
            !routeData.Values.ContainsKey("Controller"))
            routeData.Values.Add("controller", controller.GetType().Name.ToLower().Replace("controller", ""));

        controller.ControllerContext = new ControllerContext(wrapper, routeData, controller);
        return controller;
    }

И для использования

return Json(new SendAnswerResponse {
   Type = 10,
   SingleMessageItems = MvcHelper.RenderPartialViewToString(
                    MvcHelper.CreateController<Controller Name>().ControllerContext ,
                    "view Path", items , true)
});

https://stackoverflow.com/a/42559538/11657764

0

Mohammad 29 Окт 2019 в 06:20

Answer 2

Что возвращает response.SingleMessageItems? Он возвращает HTML? или структура данных? Я думаю, что вы пытаетесь что-то вроде этого

for(var i =0; i< response.SingleMessageItems.length; i++)
{
  $('#layoutSingleMessageItems .card-box').append(response.SingleMessageItems[i]);
}

0

Joshi 28 Окт 2019 в 21:32

Как сделать частичное представление из Json в Mvc 5 с помощью XmlHttpRequest

2 ответа

Похожие вопросы

Связанные вопросы

Новые вопросы

javascript