এএসপি.নেট এমভিসি-তে কীভাবে ভিউ মডেলটিকে জেএসএন অবজেক্টে রূপান্তর করবেন?


156

আমি জাভা বিকাশকারী, নেট থেকে নতুন। আমি একটি নেট এমভিসি 2 প্রকল্পে কাজ করছি যেখানে আমি উইজেট মোড়ানোর জন্য আংশিক দৃষ্টিভঙ্গি রাখতে চাই। প্রতিটি জাভাস্ক্রিপ্ট উইজেট অবজেক্টে একটি জেএসওএন ডেটা অবজেক্ট থাকে যা মডেল ডেটা দ্বারা পপুলেশন করা হবে। তারপরে এই ডেটা আপডেট করার পদ্ধতিগুলি ইভেন্টগুলিতে আবদ্ধ যখন ডেটা উইজেটে পরিবর্তন করা হয় বা যদি সেই ডেটা অন্য উইজেটে পরিবর্তন করা হয়।

কোডটি এরকম কিছু:

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>

আমি যা জানি না তা হ'ল কীভাবে ডেটা প্রেরণ করা যায় SomeModelViewএবং তারপরে এটি উইজেটকে জনপ্রিয় করতে এবং সেইটিকে JSON এ রূপান্তর করতে সক্ষম হতে পারে। কন্ট্রোলারে এটি করার কিছু বাস্তব সহজ উপায় আমি দেখেছি কিন্তু দৃষ্টিতে নয়। আমি অনুভব করি এটি একটি প্রাথমিক প্রশ্ন তবে আমি এই ঘড়িটি তৈরির চেষ্টা করে কয়েক ঘন্টা যাচ্ছিলাম।


1
আমি জানি এটি একটি পুরানো প্রশ্ন। আজকের হিসাবে এটি করার আরও ভাল উপায় রয়েছে। আপনার ভিউ ফলাফলের সাথে জেএসএন ইনলাইন মিশ্রিত করবেন না। জেএসএন সহজেই এজেএক্সের মাধ্যমে সিরিয়াল হয় এবং অবজেক্টের মতো আচরণ করা যায়। জাভাস্ক্রিপ্টের যে কোনও কিছুই ভিউ থেকে পৃথক হওয়া উচিত। আপনি কোনও কন্ট্রোলারের মাধ্যমে কোনও প্রচেষ্টা ছাড়াই সহজেই মডেলগুলি ফিরিয়ে দিতে পারেন।
পাইটর কুলা

উত্তর:


346

রেভার সহ এমভিসি 3-তে কৌশলটি @Html.Raw(Json.Encode(object))মনে হচ্ছে।


1
+1 আমি এইচটিএমএল.রো ব্যবহার করেছি, তবে জসন.এনকোড এবং সন্ধানের মডেলটিতে নিয়ামকটিতে স্ট্রিং যুক্ত করতে কেবল জাভাস্ক্রিপ্টসরিশালাইজার ব্যবহার
করিনি

5
আপনি ফলাফলটি JSON জাভাস্ক্রিপ্টে পাস করতে চাইলেও এই পদ্ধতিটি কার্যকর হয়। রেজার সবুজ স্কুইগলসের সাথে অভিযোগ করে যদি আপনি @ এইচটিএমএল.রো (...) কোডটিকে <script> ট্যাগগুলির মধ্যে একটি ফাংশন প্যারামিটার হিসাবে রাখেন তবে জেএসএন এটি জেএসকে ডাকা হচ্ছে বলে তৈরি করে। খুব সহজ এবং চটজলদি। +1
কার্ল হেনরিচ হ্যাঙ্কে

1
এমভিসি 3 এর পর থেকে এটি করার উপায় এটি একটি নিয়ামক থেকে ফিরে আসা উচিত। আপনার ভিউসাল্টে জসনকে এম্বেড করবেন না। পরিবর্তে JSON কে আলাদাভাবে পরিচালনা করতে একটি নিয়ামক তৈরি করুন এবং AJAX এর মাধ্যমে একটি JSON অনুরোধ করুন। আপনি যদি কিছু ভুল করছেন এই দৃষ্টিতে আপনার JSON এর প্রয়োজন হয়। হয় ভিউমোডেল বা অন্য কিছু ব্যবহার করুন।
পাইটর কুলা

3
জসন.এনকোড আমার দ্বি-মাত্রিক অ্যারেটিকে জসনের একটি 1-মাত্রিক অ্যারেতে এনকোড করে। নিউটনসফট.জসন.জসন কনভার্ট.সরিয়ালাইজঅবজেক্ট দুটি মাত্রাকে যথাযথভাবে জসন-এ রূপায়িত করে। সুতরাং আমি পরবর্তীটি ব্যবহার করার পরামর্শ দিই।
mono68

12
এমভিসি 6 ব্যবহার করার সময় (সম্ভবত 5) আপনার Json.Serializeএনকোডের পরিবর্তে ব্যবহার করা দরকার ।
কোয়ালা বিয়ার

31

ভাল, আপনি কেবলমাত্র এমভিসি ব্যবহার শুরু করেছেন এবং আপনি এর প্রথম প্রধান ত্রুটি খুঁজে পেয়েছেন।

আপনি দৃশ্যে এটিকে জেএসএনে রূপান্তরিত করতে চান না এবং আপনি এটিকে নিয়ামকের মধ্যে রূপান্তর করতে চান না, কারণ এই অবস্থানগুলির কোনওটিরই অর্থ নেই। দুর্ভাগ্যক্রমে, আপনি এই পরিস্থিতিতে আটকে আছেন।

আমি যা করতে পেরেছি তার মধ্যে সবচেয়ে ভাল জিনিসটি ভিউমোডেলে ভিজে JSON প্রেরণ করুন, এটির মতো:

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

return View("viewname", viewModel);

তারপরে ব্যবহার করুন

<%= Model.JsonData %>

আপনার দৃষ্টিতে সচেতন থাকুন যে স্ট্যান্ডার্ড .NET জাভাস্ক্রিপ্টসরিয়ালাইজারটি বেশ বাজে।

নিয়ামকের মধ্যে এটি করা কমপক্ষে এটি পরীক্ষার যোগ্য করে তোলে (যদিও উপরের মতো না - আপনি সম্ভবত কোনও ইশিরাইলাইজারকে নির্ভরতা হিসাবে নিতে চান যাতে আপনি এটি উপহাস করতে পারেন)

আপনার জাভাস্ক্রিপ্ট সম্পর্কেও আপডেট করুন , আপনার উপরের সমস্ত উইজেট জেএসটি মোড়ানো ভাল অনুশীলন হবে:

(
    // all js here
)();

আপনি যদি কোনও পৃষ্ঠায় একাধিক উইজেট রাখেন তবে আপনি বিরোধ পাবেন না (যদি না আপনি অন্য পৃষ্ঠায় অন্য কোনও পদ্ধতি থেকে অ্যাক্সেসের প্রয়োজন না হয় তবে সেই ক্ষেত্রে আপনার কোনও উইজেটের কাঠামোর সাথে উইজেটটি নিবন্ধভুক্ত করা উচিত)। এটি এখন কোনও সমস্যা নাও হতে পারে, তবে ভবিষ্যতে যখন প্রয়োজনীয়তা হয়ে উঠবে তখন নিজেকে প্রচুর পরিশ্রম বাঁচাতে বন্ধনী যুক্ত করা এখন ভাল অনুশীলন হবে, কার্যকারিতাটি encapsulate করাও ওও অনুশীলন।


1
এটি আকর্ষণীয় দেখায়। আমি কেবলমাত্র জসন হিসাবে ডেটার একটি অনুলিপি তৈরি করতে যাচ্ছিলাম এবং ভিউডাটা হিসাবে এটি পাস করছিলাম তবে এইভাবে এটি আরও আকর্ষণীয় দেখায়। আমি এটি নিয়ে খেলব এবং আপনাকে জানাবো। বিটিডাব্লু এটি আমার প্রথমবারের মতো স্ট্যাকওভারফ্লোতে একটি প্রশ্ন পোস্ট করেছে এবং ভাল প্রতিক্রিয়া পেতে এটি কি গ্রহণ করেছে ... 5 মিনিট, এটি দুর্দান্ত!
ক্রিস স্টিফেন্স

Nothings ভুল এটা দিয়ে, তার ঠিক স্বনির্ধারিত না, যদি আপনি কোনো কাস্টম মান বিন্যাস চাই হাত আগে এটা করতে, মূলত সবকিছু একটি স্ট্রিং উপার্জন নেই :( এই তারিখ দিয়ে বিশিষ্ট হয়। আমি জানি সহজ সমাধান নীচে উপস্থিত আছে, কিন্তু তারা হতে উচিত না প্রয়োজনীয়!
অ্যান্ড্রু বুলক

@ আপডেটে আমি সেই উইজেটের একটি। নেট স্ট্যাটিক কাউন্টার ব্যবহার করে অনন্য কোনও অবজেক্টের নাম তৈরি করতে দেখতে যাচ্ছিলাম। তবে আপনি যা লিখেছেন তা দেখে মনে হচ্ছে এটি একই জিনিসটি সম্পাদন করবে এবং চটজলদি করবে। এছাড়াও আমি একটি পৃষ্ঠার স্তরের অবজেক্টের জন্য "নতুন_আপনার_ইভেন্ট" একটি উইজেট তৈরি করতে বাধ্য করেছিলাম যা তাদের ট্র্যাক করার জন্য তবে এটি করার মূল কারণ ওবিই হয়ে গেছে So তাই আমি পরে আবারও এটি দেখতে পাব all পোস্টটি যাব এমন সমস্ত সহায়তার জন্য ধন্যবাদ আপনি যা পরামর্শ দিয়েছেন তার একটি পরিবর্তিত সংস্করণ তবে আমার কেন ভাল লাগছে তা ব্যাখ্যা করুন
ক্রিস স্টিফেনস

2
আমি আমার আগের বক্তব্যটি প্রত্যাহার করি "এতে কোনও ভুল নেই"। এটিতে সব কিছু ভুল আছে।
অ্যান্ড্রু বুলক

আপনি কেন বলেন যে আমরা নিয়ামক থেকে JSON ফিরিয়ে দিতে পারি না। এভাবেই এটি করার কথা to ব্যবহার JavaScriptSerializerবা Return Json(object)উভয় একই সিরিয়ালাইজার ব্যবহার। এছাড়াও একই জেএসএনকে আবার নিয়ামককে পোস্ট করা আপনার অবজেক্টটিকে পুনর্নির্মাণ করবে যতক্ষণ আপনি সঠিক মডেলটি সংজ্ঞায়িত করেন না। হয়তো এমভিসি 2 এর সময় এটি একটি বড় অসুবিধা ছিল .. তবে আজ এটি একটি বাতাস এবং খুব সুবিধাজনক। এটি প্রতিফলিত করতে আপনার উত্তর আপডেট করা উচিত।
পাইটর কুলা

18

আমি এটির মতো করে এটি দেখতে বেশ সুন্দর বলে মনে করেছি (দর্শনে ব্যবহার):

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

এখানে সহায়িকা পদ্ধতি এক্সটেনশন শ্রেণিটি রয়েছে:

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());
    }
}

এটি অতিমাত্রায় নমনীয় নয়, তবে এটি কোথায় রাখা উচিত তা সমস্যার সমাধান করে (নিয়ন্ত্রণকারী বা দৃষ্টিতে?) উত্তরটি অবশ্যই স্পষ্ট: নয়;)


এটি আমার মতে সুন্দর এবং পরিষ্কার ছিল এবং একটি পুনঃব্যবহারযোগ্য সাহায্যকারীের মধ্যে জড়িত। চিয়ার্স, জে
জন

6

তুমি ব্যবহার করতে পার Json সরাসরি ক্রিয়া থেকে ,

আপনার ক্রিয়াটি এরকম কিছু হবে:

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

সম্পাদন করা

কেবলমাত্র দেখেছেন যে আপনি এটি Modelএকটি দৃশ্যেরূপে ধরে নিয়েছেন তাই উপরোক্ত কঠোরভাবে সঠিক নয়, এটি পাওয়ার জন্য Ajaxআপনাকে নিয়ামক পদ্ধতিতে একটি কল করতে হবে,ascx হবে তারপরে সেড প্রতি মডেল থাকবে না, আমি আমার কোডটি ছেড়ে দেব কেবলমাত্র যদি এটি আপনার পক্ষে কার্যকর হয় এবং আপনি কলটি সংশোধন করতে পারেন

2 সম্পাদনা করুন কেবল কোডে আইডি রাখুন


1
তবে তিনি এটিকে এই দৃষ্টিভঙ্গিতে প্রকাশ করতে পারেন না, তাকে ২ য় এজ্যাক্স কল করতে হবে
অ্যান্ড্রু বুলক

ধন্যবাদ, আমি মূলত jQuery get json কল ব্যবহার করে এটি করছিলাম এবং এইচটিএমএল উপাদানগুলি তাদেরকে জসন থেকে আলাদা করে আনার পরিকল্পনা করছিলাম। যাইহোক, আমরা এখন যে প্যাটার্নটি অনুসরণ করছি তা হ'ল আমাদের দর্শনগুলি কোনও মডেলভিউকে ফিরিয়ে আনতে হবে এবং এটি টেবিল ইত্যাদির মতো বেসিক এইচটিএমএল উপাদানগুলি পপুল করার সহজতম উপায় আমি ভিএসডাটা হিসাবে জেএসএন ফর্ম্যাটে একই ডেটা পাঠাতে পারতাম তবে এটি অপব্যয় বলে মনে হয়।
ক্রিস স্টিফেনস

2
আপনার কোনও ভিউ ফলাফলের সাথে জেএসএন এম্বেড করা উচিত নয়। ওপিকে হয় স্ট্যান্ডার্ড এমভিসি অনুশীলনের সাথে লেগে থাকতে হবে এবং একটি মডেল বা ভিউ মডেল ফিরে আসতে হবে বা একটি এজেএক্স করতে হবে। একটি ভিউ সহ জেএসএনকে এম্বেড করার জন্য একেবারেই কোনও কারণ নেই। এটি কেবল খুব নোংরা কোড। এই উত্তরটি সঠিক পদ্ধতি এবং মাইক্রোসফ্ট অনুশীলনগুলির প্রস্তাবিত উপায়। ডাউনভোটটি অপ্রয়োজনীয় ছিল এটি অবশ্যই সঠিক উত্তর। আমাদের খারাপ কোডিং অনুশীলনগুলিকে উত্সাহিত করা উচিত নয়। হয় এজেএক্সের মাধ্যমে জেএসএন বা ভিউজের মাধ্যমে মডেল। মিশ্র মার্কআপের সাথে স্প্যাগেটি কোডটি কেউ পছন্দ করে না!
পাইটর কুলা

এই সমাধানটির ফলে নিম্নলিখিত সমস্যার ফলস্বরূপ দেখা যাবে: স্ট্যাকওভারফ্লো
জেনি ও'রেলি



0

ডেভ থেকে দুর্দান্ত উত্তর প্রসারিত । আপনি একটি সাধারণ এইচটিএমএল সহায়তা তৈরি করতে পারেন ।

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

এবং আপনার দৃষ্টিতে:

@Html.RenderAsJson(Model)

আপনি যদি কোনও কারণে, পরে যুক্তিটি পরিবর্তন করতে চান তবে আপনি JSON তৈরির জন্য যুক্তিটিকে কেন্দ্রিক করতে পারেন।


0

অ্যান্ড্রু একটি দুর্দান্ত প্রতিক্রিয়া ছিল কিন্তু আমি এটি একটি সামান্য টুইট করতে চাই। এটি যেভাবে আলাদা তা হ'ল আমি আমার মডেলভিউগুলিতে ওভারহেড ডেটা না রাখাই পছন্দ করি। অবজেক্টের জন্য কেবল ডেটা। দেখে মনে হচ্ছে ওভার ডেটা ওভার হেড ডেটার জন্য বিলটি ফিট করে তবে অবশ্যই আমি এতে নতুন new আমি এই জাতীয় কিছু করার পরামর্শ দিচ্ছি।

নিয়ামক

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

দৃশ্য

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

এটি আপনার জন্য যা করে তা হ'ল এটি আপনাকে আপনার মডেলভিউর মতো আপনার জেএসএন-তে একই ডেটা দেয় যাতে আপনি সম্ভাব্যভাবে আপনার নিয়ামকের কাছে জেএসএনকে ফিরিয়ে দিতে পারেন এবং এতে সমস্ত অংশ থাকবে। এটি কেবল একটি JSONRequest এর মাধ্যমে অনুরোধ করার অনুরূপ তবে এটির জন্য আরও একটি কল প্রয়োজন যাতে এটি আপনাকে সেই ওভারহেড সংরক্ষণ করে। বিটিডাব্লু এটি তারিখগুলির জন্য মজাদার তবে এটি অন্য থ্রেডের মতো মনে হচ্ছে।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.