2013-03-04 4 views
34

MVCアプリケーションを使用して、コントローラからjsonオブジェクトを渡す必要があります。MVCコントローラーからJsonオブジェクトを表示する方法

var dictionary = listLocation.ToDictionary(x => x.label, x => x.value); 
return Json(new { values = listLocation}, JsonRequestBehavior.AllowGet); 

私はそれは私がフォーマットを必要に応じてJSONオブジェクトを与えたときに、ファイルのオープンビューのページがその私のブラウザにダウンロードダイアログを開いて展開し、今私は私のコントローラで使用しています上記のコード、。

私はビューページを返したいので、ビューページのjsonオブジェクトにもアクセスしたいと思います。どうやってやるの。

答えて

54

、およびシリアル化されたJSONデータを提供するために:あなたはjQueryのを使用している場合たとえば、あなたは$.ajax()メソッドを使用する場合があります。このデータの処理方法がわからないため、ブラウザにダウンロードダイアログが表示されます。

あなたの代わりにビューを返すようにしたい場合は、単に通常どおりのようなreturn View(...)ん:

var dictionary = listLocation.ToDictionary(x => x.label, x => x.value); 
return View(new { Values = listLocation }); 

は、その後、あなたのビューでは、単にJSONとしてあなたのデータをエンコードし、JavaScript変数に代入:

<script> 
    var values = @Html.Raw(Json.Encode(Model.Values)); 
</script> 

EDIT

もう少し完全なサンプルです。私はあなたから十分な文脈がないので、このサンプルはコントローラFoo、アクションBar、およびビューモデルFooBarModelと仮定します。また、場所のリストは、ハードコードされています

コントローラ/ FooController.cs

public class FooController : Controller 
{ 
    public ActionResult Bar() 
    { 
     var locations = new[] 
     { 
      new SelectListItem { Value = "US", Text = "United States" }, 
      new SelectListItem { Value = "CA", Text = "Canada" }, 
      new SelectListItem { Value = "MX", Text = "Mexico" }, 
     }; 

     var model = new FooBarModel 
     { 
      Locations = locations, 
     }; 

     return View(model); 
    } 
} 

モデル/ FooBarModel.cs

public class FooBarModel 
{ 
    public IEnumerable<SelectListItem> Locations { get; set; } 
} 

ビュー/フー/ Bar.cshtml

@model MyApp.Models.FooBarModel 

<script> 
    var locations = @Html.Raw(Json.Encode(Model.Locations)); 
</script> 

エラーメッセージが表示されるため、互換性のないタイプ(つまり、互換性のないタイプ)が混在しているようです。 Ported_LI.Models.Locatio‌​nMyApp.Models.Location)ですので、コントローラのアクション側から送信されたタイプとビューから受信したタイプが一致していることを確認してください。特にこのサンプルの場合、コントローラー内のnew FooBarModelは、ビュー内の@model MyApp.Models.FooBarModelと一致します。

+0

こんにちはダニエル、私は上記のコードを使用すると、私のビューのページで、次のエラーが発生しました。"辞書に渡されたモデル項目は、 '<> f__AnonymousType3'1 [System.Collections.Generic.List'1 [Ported_LI.Models.Location]]'型ですが、この辞書にはMyApp.Models型のモデル項目が必要です。ロケーション'"。 さらに手助けをしてください。 – Purushoth

+2

まさに私が探していたものです。 Jsonのエンコーディングを行うのは奇妙なことです。私はコントローラーがこの機能を持っているはずだと思います。あなたの例は非常に便利です。 – IAbstract

+0

@IAbstract本当に欲しかったら、コントローラに 'Json.Encode'を置くことができます。個人的には、私はそれをしません。なぜなら、(1)コントローラのロジックは単純なままなので、 (2)カノニカル表現はより柔軟性を提供します。たとえば、コレクションを反復処理したり、条件文を実行したりできます(つまり、if(Model.Locations.Any()){...}など)。あなたのコントローラでエンコードしている場合、あなたのビューは基本的に文字列で止まっています。 (3)コントローラーが本質的にプレゼンテーション上の懸案事項であるとは考えていません(JSONの必要性を示すのはJavaScriptです)。乾杯。 –

3

AJAXを使用して、このコントローラアクションを呼び出すことができます。あなたは、特にビューを使用しないようにMVC を言っているreturn Json(...)を行うと

<script type="text/javascript"> 
    $.ajax({ 
     url: '@Url.Action("NameOfYourAction")', 
     type: 'GET', 
     cache: false, 
     success: function(result) { 
      // you could use the result.values dictionary here 
     } 
    }); 
</script> 
+0

こんにちはダーリン、私はあなたの方法は、まだビューページにアクセスするときの対話をダウンロードできます試してみました。 – Purushoth

-2
$.ajax({ 
    dataType: "json", 
    type: "POST", 
    url: "/Home/AutocompleteID", 
    data: data, 
    success: function (data) { 
     $('#search').html(''); 
     $('#search').append(data[0].Scheme_Code); 
     $('#search').append(data[0].Scheme_Name); 
    } 
}); 
+2

コードの内容とその回答の説明を含めてください。コードスニペットを回答として受け取った場合、そのコードスニペットで何をすべきか分からないことがあります。回答はOPと将来の訪問者に問題のデバッグと修正方法に関するガイダンスを提供する必要があります。コードの背後にある考え方は、問題の理解とソリューションの適用または変更に非常に役立ちます。 – Palec

+0

@Palec私はあなたの説明に同意しますが、スニペットをより良い答えにすると信じていますが、実際には10K +と100K +回答者は常にスニペットを与え、それは問題なく受け入れられます。したがって、統治哲学の変更が行われない限り、現時点ではこの回答は合法です。 – demongolem

+0

@demongolem VLQレビューキューからこれを受け取り、コメントを投稿して編集しました。削除を示唆していませんでした。私は、コードスニペットの答えはOKであるという事実について(私たちは)同意した(https://stackoverflow.com/review/low-quality-posts/5258279)。私はそれらをより良くするための指針を与えるのが好きです。 – Palec

0
<script type="text/javascript"> 
jQuery(function() { 
    var container = jQuery("\#content"); 
    jQuery(container) 
    .kendoGrid({ 
     selectable: "single row", 
     dataSource: new kendo.data.DataSource({ 
      transport: { 
       read: { 
        url: "@Url.Action("GetMsgDetails", "OutMessage")" + "?msgId=" + msgId, 
        dataType: "json", 
       }, 
      }, 
      batch: true, 
     }), 
     editable: "popup", 
     columns: [ 
      { field: "Id", title: "Id", width: 250, hidden: true }, 
      { field: "Data", title: "Message Body", width: 100 }, 
      { field: "mobile", title: "Mobile Number", width: 100 }, 
     ] 
    }); 
}); 

+0

JsonはHTMLデータを返します。このjsonの結果を表示する方法 –

関連する問題