web-dev-qa-db-ja.com

JSONまたは部分的なHTMLを返すASP.NET MVCコントローラのアクション

パラメータに応じてJSONまたは部分的なHTMLを返すコントローラアクションを作成しようとしています。結果をMVCページに非同期的に返すための最良の方法は何ですか?

386
NathanD

あなたのアクションメソッドで、JSONをあなたのページに返すためにJson(object)を返してください。

public ActionResult SomeActionMethod() {
  return Json(new {foo="bar", baz="Blech"});
}

それならAjaxを使ってアクションメソッドを呼び出してください。次のようなViewPageからのヘルパーメソッドの1つを使用することができます。

<%= Ajax.ActionLink("SomeActionMethod", new AjaxOptions {OnSuccess="somemethod"}) %>

SomeMethodは、返されたJsonオブジェクトを評価するJavaScriptメソッドになります。

プレーンな文字列を返したい場合は、ContentResultを使用することができます。

public ActionResult SomeActionMethod() {
    return Content("hello world!");
}

ContentResultはデフォルトでtext/plainをcontentTypeとして返します。
これはオーバーロード可能なので、次のこともできます。

return Content("<xml>This is poorly formatted xml.</xml>", "text/xml");
490
Haacked

リクエストのAcceptTypeを考慮する必要があると思います。次のように正しいコンテンツタイプを返すために現在のプロジェクトで使用しています。

コントローラ上のあなたのアクションはリクエストオブジェクト上のようにそれをテストすることができます

if (Request.AcceptTypes.Contains("text/html")) {
   return View();
}
else if (Request.AcceptTypes.Contains("application/json"))
{
   return Json( new { id=1, value="new" } );
}
else if (Request.AcceptTypes.Contains("application/xml") || 
         Request.AcceptTypes.Contains("text/xml"))
{
   //
}

次に、部分的なxhtmlレスポンスのケースを満たすためにビューのaspxを実装できます。

それからjQueryであなたはjsonとしてtypeパラメータを渡してそれを取得することができます:

$.get(url, null, function(data, textStatus) {
        console.log('got %o with status %s', data, textStatus);
        }, "json"); // or xml, html, script, json, jsonp or text

これがJamesに役立つことを願っています

108
James Green

JSONデータを扱うもう1つの良い方法は、JQueryのgetJSON関数を使うことです。あなたは呼び出すことができます

public ActionResult SomeActionMethod(int id) 
{ 
    return Json(new {foo="bar", baz="Blech"});
}

JqueryのgetJSONメソッドから単純に...

$.getJSON("../SomeActionMethod", { id: someId },
    function(data) {
        alert(data.foo);
        alert(data.baz);
    }
);
75
SaaS Developer

MVC ajax GET呼び出しをJQueryで実装する際に問題がいくつかあり、頭痛の種となるので、ここで解決策を共有しました。

  1. Ajax呼び出しにデータ型 "json"を含めるようにしてください。これにより、返されたJSONオブジェクトが自動的に解析されます(サーバーから有効なjsonが返された場合)。
  2. JsonRequestBehavior.AllowGetを含めます。このMVCがないと、HTTP 500エラーが返されました(クライアントでdataType: jsonが指定されている場合)。
  3. $ .ajax呼び出しにcache: falseを追加します。そうしないと、最終的に(HTTP 200応答ではなく)HTTP 304応答が返され、サーバーは要求を処理しません。
  4. 最後に、JSONでは大文字と小文字が区別されるため、要素の大文字と小文字の区別はサーバー側とクライアント側で一致させる必要があります。

サンプルJQuery:

$.ajax({
  type: 'get',
  dataType: 'json',
  cache: false,
  url: '/MyController/MyMethod',
  data: { keyid: 1, newval: 10 },
  success: function (response, textStatus, jqXHR) {
    alert(parseInt(response.oldval) + ' changed to ' + newval);                                    
  },
  error: function(jqXHR, textStatus, errorThrown) {
    alert('Error - ' + errorThrown);
  }
});

サンプルMVCコード:

[HttpGet]
public ActionResult MyMethod(int keyid, int newval)
{
  var oldval = 0;

  using (var db = new MyContext())
  {
    var dbRecord = db.MyTable.Where(t => t.keyid == keyid).FirstOrDefault();

    if (dbRecord != null)
    {
      oldval = dbRecord.TheValue;
      dbRecord.TheValue = newval;
      db.SaveChanges();
    }
  }

    return Json(new { success = true, oldval = oldval},
                JsonRequestBehavior.AllowGet);
}
45
Shane

質問の残り半分に答えるために、あなたは呼び出すことができます:

return PartialView("viewname");

部分的なHTMLを返したいとき。おそらくURL部分/パラメータに基づいて、リクエストがJSONまたはHTMLのどちらを希望するかを決定するための何らかの方法を見つける必要があります。

13
Brad Wilson

インコーディングフレームワークを使用した代替ソリューション

アクションリターンjson

コントローラ

    [HttpGet]
    public ActionResult SomeActionMethod()
    {
        return IncJson(new SomeVm(){Id = 1,Name ="Inc"});
    }

かみそりのページ

@using (var template = Html.Incoding().ScriptTemplate<SomeVm>("tmplId"))
{
    using (var each = template.ForEach())
    {
        <span> Id: @each.For(r=>r.Id) Name: @each.For(r=>r.Name)</span>
    }
}

@(Html.When(JqueryBind.InitIncoding)
  .Do()
  .AjaxGet(Url.Action("SomeActionMethod","SomeContoller"))
  .OnSuccess(dsl => dsl.Self().Core()
                              .Insert
                              .WithTemplate(Selector.Jquery.Id("tmplId"))
                              .Html())
  .AsHtmlAttributes()
  .ToDiv())

アクションリターンHTML

コントローラ

    [HttpGet]
    public ActionResult SomeActionMethod()
    {
        return IncView();
    }

かみそりのページ

@(Html.When(JqueryBind.InitIncoding)
  .Do()
  .AjaxGet(Url.Action("SomeActionMethod","SomeContoller"))
  .OnSuccess(dsl => dsl.Self().Core().Insert.Html())
  .AsHtmlAttributes()
  .ToDiv())
7
Vlad

あなたはこれを非常にうまくカバーしているこの非常に役に立つ記事を見たいと思うかもしれません!

ちょうどそれがこの問題に対する良い解決策を探す人々を助けるかもしれないと思った。

http://weblogs.asp.net/rashid/archive/2009/04/15/adaptive-rendering-in-asp-net-mvc.aspx

6
Paul Hinett

MVC 3にアップグレードした人のために、ここできちんとした方法は MVC3とJsonを使う

4
Sarath

PartialViewResultとJSONReusltは、基本クラスActionResultから継承します。そのため、戻り値の型が動的に決定された場合は、メソッド出力をActionResultとして宣言します。

public ActionResult DynamicReturnType(string parameter)
        {
            if (parameter == "JSON")
                return Json("<JSON>", JsonRequestBehavior.AllowGet);
            else if (parameter == "PartialView")
                return PartialView("<ViewName>");
            else
                return null;


        }
3
Anil Vaddepally
    public ActionResult GetExcelColumn()
    {            
            List<string> lstAppendColumn = new List<string>();
            lstAppendColumn.Add("First");
            lstAppendColumn.Add("Second");
            lstAppendColumn.Add("Third");
  return Json(new { lstAppendColumn = lstAppendColumn,  Status = "Success" }, JsonRequestBehavior.AllowGet);
            }
        }
2
sakthi

要求に基づいてさまざまな出力を生成するための柔軟なアプローチ

public class AuctionsController : Controller
{
  public ActionResult Auction(long id)
  {
    var db = new DataContext();
    var auction = db.Auctions.Find(id);

    // Respond to AJAX requests
    if (Request.IsAjaxRequest())
      return PartialView("Auction", auction);

    // Respond to JSON requests
    if (Request.IsJsonRequest())
      return Json(auction);

    // Default to a "normal" view with layout
    return View("Auction", auction);
  }
}

Request.IsAjaxRequest()メソッドはきわめて単純です。X-Requested-Withヘッダの値がXMLHttpRequestであるかどうかを確認するために着信要求のHTTPヘッダをチェックするだけです。これは、ほとんどのブラウザおよびAJAXフレームワークによって自動的に追加されます。

Request.IsAjaxRequest()拡張メソッドのように、どこからでも呼び出すことができるように、リクエストがJSONに対するものであるかどうかを確認するためのカスタム拡張メソッド。

using System;
using System.Web;

public static class JsonRequestExtensions
{
  public static bool IsJsonRequest(this HttpRequestBase request)
  {
    return string.Equals(request["format"], "json");
  }
}

ソース: https://www.safaribooksonline.com/library/view/program-aspnet-mvc/9781449321932/ch06.html#_javascript_rendering

0
Mannan Bahelim