Làm cách nào để chuyển đổi View Model thành đối tượng JSON trong ASP.NET MVC?

Tôi là một nhà phát triển Java, mới sử dụng .NET. Tôi đang làm việc trên một dự án .NET MVC2 nơi tôi muốn có một chế độ xem một phần để bọc một widget. Mỗi đối tượng tiện ích JavaScript có một đối tượng dữ liệu JSON sẽ được điền bởi dữ liệu mô hình. Sau đó, các phương pháp để cập nhật dữ liệu này bị ràng buộc với các sự kiện khi dữ liệu được thay đổi trong widget hoặc nếu dữ liệu đó bị thay đổi trong một widget khác.

Mã này là một cái gì đó như thế này:

MyController:

virtual public ActionResult DisplaySomeWidget(int id) {
  SomeModelView returnData = someDataMapper.getbyid(1);

  return View(myview, returnData);
}

myview.ascx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<SomeModelView>" %>

<script type="text/javascript">
  //creates base widget object;
  var thisWidgetName = new Widget();

  thisWidgetName.updateTable = function() {
    //  UpdatesData
  };
  $(document).ready(function () {
    thisWidgetName.data = <% converttoJSON(model) %>
    $(document).bind('DATA_CHANGED', thisWidgetName.updateTable());
  });
</script>

<div><%:model.name%></div>

Những gì tôi không biết là làm thế nào để gửi dữ liệu qua SomeModelViewvà sau đó có thể sử dụng dữ liệu đó để điền vào tiện ích cũng như chuyển đổi dữ liệu đó thành JSON. Tôi đã thấy một số cách đơn giản thực sự để làm điều đó trong bộ điều khiển nhưng không phải trong chế độ xem. Tôi nghĩ rằng đây là một câu hỏi cơ bản nhưng tôi đã mất vài giờ để cố gắng thực hiện điều này.

Trong mvc3 với dao cạo @Html.Raw(Json.Encode(object))dường như làm được mẹo.

Làm tốt lắm, bạn chỉ mới bắt đầu sử dụng MVC và bạn đã tìm thấy lỗ hổng lớn đầu tiên của nó.

Bạn không thực sự muốn chuyển đổi nó thành JSON trong chế độ xem và bạn không thực sự muốn chuyển đổi nó trong bộ điều khiển, vì cả hai vị trí này đều không có ý nghĩa. Thật không may, bạn bị mắc kẹt với tình huống này.

Điều tốt nhất tôi tìm thấy là gửi JSON đến chế độ xem trong ViewModel, như thế này:

var data = somedata;
var viewModel = new ViewModel();
var serializer = new JavaScriptSerializer();
viewModel.JsonData = serializer.Serialize(data);

return View("viewname", viewModel);

sau đó sử dụng

<%= Model.JsonData %>

theo quan điểm của bạn. Xin lưu ý rằng .NET JavaScriptSerializer chuẩn là khá tào lao.

thực hiện nó trong bộ điều khiển ít nhất làm cho nó có thể kiểm tra được (mặc dù không chính xác như ở trên - bạn có thể muốn lấy ISerializer làm phụ thuộc để bạn có thể chế giễu nó)

Ngoài ra, cập nhật , liên quan đến JavaScript của bạn, sẽ là một cách tốt để bọc TẤT CẢ các tiện ích con bạn có ở trên như vậy:

(
    // all js here
)();

bằng cách này nếu bạn đặt nhiều widget trên một trang, bạn sẽ không bị xung đột (trừ khi bạn cần truy cập các phương thức từ nơi khác trong trang, nhưng trong trường hợp đó bạn vẫn nên đăng ký widget với một số khung widget). Bây giờ nó có thể không phải là vấn đề, nhưng sẽ tốt hơn nếu thêm dấu ngoặc ngay bây giờ để tiết kiệm cho bạn nhiều nỗ lực trong tương lai khi nó trở thành một yêu cầu, đó cũng là cách thực hành OO tốt để đóng gói chức năng.

Tôi thấy nó là khá tốt để làm điều đó như thế này (sử dụng trong chế độ xem):

    @Html.HiddenJsonFor(m => m.TrackingTypes)

Dưới đây là lớp mở rộng của phương thức trợ giúp:

public static class DataHelpers
{
    public static MvcHtmlString HiddenJsonFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression)
    {
        return HiddenJsonFor(htmlHelper, expression, (IDictionary<string, object>) null);
    }

    public static MvcHtmlString HiddenJsonFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes)
    {
        return HiddenJsonFor(htmlHelper, expression, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
    }

    public static MvcHtmlString HiddenJsonFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, IDictionary<string, object> htmlAttributes)
    {
        var name = ExpressionHelper.GetExpressionText(expression);
        var metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);

        var tagBuilder = new TagBuilder("input");
        tagBuilder.MergeAttributes(htmlAttributes);
        tagBuilder.MergeAttribute("name", name);
        tagBuilder.MergeAttribute("type", "hidden");

        var json = JsonConvert.SerializeObject(metadata.Model);

        tagBuilder.MergeAttribute("value", json);

        return MvcHtmlString.Create(tagBuilder.ToString());
    }
}

Nó không phải là siêu tinh vi, nhưng nó giải quyết vấn đề đặt nó ở đâu (trong Bộ điều khiển hoặc trong chế độ xem?) Câu trả lời rõ ràng là: không;)

Bạn có thể sử dụng Jsontrực tiếp từ hành động,

Hành động của bạn sẽ giống như thế này:

virtual public JsonResult DisplaySomeWidget(int id)
{
    SomeModelView returnData = someDataMapper.getbyid(id);
    return Json(returnData);
}

Biên tập

Chỉ cần thấy rằng bạn cho rằng đây là ModelChế độ xem nên ở trên không đúng hoàn toàn, bạn sẽ phải thực hiện Ajaxcuộc gọi đến phương thức điều khiển để có được điều này, ascxsau đó sẽ không có mô hình, tôi sẽ để lại mã của mình chỉ trong trường hợp nó hữu ích cho bạn và bạn có thể sửa đổi cuộc gọi

Chỉnh sửa 2 chỉ cần đặt id vào mã

@ Html.Raw (Json.Encode (object)) có thể được sử dụng để chuyển đổi View Modal Object thành JSON

<htmltag id=’elementId’ data-ZZZZ’=’@Html.Raw(Json.Encode(Model))’ />

Tham khảo https://highspeedlowdrag.wordpress.com/2014/08/23/mvc-data-to-jquery-data/

Tôi đã làm dưới đây và nó hoạt động như sự quyến rũ.

<input id="hdnElement" class="hdnElement" type="hidden" value='@Html.Raw(Json.Encode(Model))'>

Mở rộng câu trả lời tuyệt vời từ Dave . Bạn có thể tạo một HtmlHelper đơn giản .

public static IHtmlString RenderAsJson(this HtmlHelper helper, object model)
{
    return helper.Raw(Json.Encode(model));
}

Và theo quan điểm của bạn:

@Html.RenderAsJson(Model)

Bằng cách này, bạn có thể tập trung logic để tạo JSON nếu bạn, vì một số lý do, muốn thay đổi logic sau này.

Andrew đã có một phản hồi tuyệt vời nhưng tôi muốn làm mờ đi một chút. Cách khác biệt là tôi thích ModelView của mình không có dữ liệu trên đầu. Chỉ là dữ liệu cho đối tượng. Có vẻ như ViewData phù hợp với hóa đơn cho dữ liệu trên đầu, nhưng tất nhiên tôi mới biết điều này. Tôi đề nghị làm một cái gì đó như thế này.

Bộ điều khiển

virtual public ActionResult DisplaySomeWidget(int id)
{
    SomeModelView returnData = someDataMapper.getbyid(1);
    var serializer = new JavaScriptSerializer();
    ViewData["JSON"] = serializer.Serialize(returnData);
    return View(myview, returnData);
}

Lượt xem

//create base js object;
var myWidget= new Widget(); //Widget is a class with a public member variable called data.
myWidget.data= <%= ViewData["JSON"] %>;

Điều này làm cho bạn là nó cung cấp cho bạn cùng một dữ liệu trong JSON của bạn như trong ModelView để bạn có thể trả lại JSON cho bộ điều khiển của bạn và nó sẽ có tất cả các phần. Điều này tương tự với việc chỉ yêu cầu nó thông qua JSONRequest tuy nhiên nó yêu cầu một cuộc gọi ít hơn để nó tiết kiệm cho bạn chi phí đó. BTW này là sôi nổi cho Ngày nhưng dường như là một chủ đề khác.