web-dev-qa-db-ja.com

MVCコントローラーへのAjax呼び出し-URLの問題

以前に投稿されたjQuery/MVCの質問を調べましたが、有効な答えは見つかりませんでした。

次のJavaScriptコードがあります。

$.ajax({
 type: "POST",
 url: '@Url.Action("Search","Controller")',
 data: "{queryString:'" + searchVal + "'}",
 contentType: "application/json; charset=utf-8",
 dataType: "html",
 success: function (data) {
 alert("here" + data.d.toString());
 }
});

Urlを呼び出すと、投稿は次のようになります。

NetworkError: 500 Internal Server Error - <a href="http://localhost/Web/Navigation/@Url.Action(%22Search%22,%22Chat%22)"></a>

誰かが私にそれをなぜこのように返すのか（その背後にあるロジック）を説明して、有効な解決策を提供してくれませんか？前もって感謝します！
PS：追加情報：％22は<< ">>文字のURLエンコードリファレンスです

javascriptjqueryajaxasp.net-mvc-3
19
Mihai Labo

これが機能するためには、JavascriptをRazorビュー内に配置して、行が

@Url.Action("Action","Controller")

razorによって解析され、実際の値が置き換えられます。

Javascriptをビューに移動したくない場合は、ビューで設定オブジェクトを作成し、それをJavascriptファイルから参照することを検討できます。

例えば.

var MyAppUrlSettings = {
    MyUsefulUrl : '@Url.Action("Action","Controller")'
}

.jsファイル内

$.ajax({
 type: "POST",
 url: MyAppUrlSettings.MyUsefulUrl,
 data: "{queryString:'" + searchVal + "'}",
 contentType: "application/json; charset=utf-8",
 dataType: "html",
 success: function (data) {
 alert("here" + data.d.toString());
});

または、フレームワークの built in Ajax メソッドを活用して、JSコードでビューを「汚染」せずに同じことを実現できるHtmlHelpers内のメソッドを確認します。

56
Rob Stevenson-Leggett

コードの例に型エラーがあります。 successの後に中括弧を忘れる

$.ajax({
 type: "POST",
 url: '@Url.Action("Search","Controller")',
 data: "{queryString:'" + searchVal + "'}",
 contentType: "application/json; charset=utf-8",
 dataType: "html",
 success: function (data) {
     alert("here" + data.d.toString());
 }
})

;

10
Yorgo

ビューを関与させずにそれを行う良い方法は次のとおりです。

$.ajax({
    type: "POST",
    url: '/Controller/Search',
    data: { queryString: searchVal },
    success: function (data) {
      alert("here" + data.d.toString());
    }
});

これは、URLへのPOSTを試みます。

「http：// domain/Controller/Search（使用するアクションの正しいURL）

9
SJCypher

Rob's answerから始めて、私は現在次の構文を使用しています。質問が多くの注目を集めているので、私はそれをあなたと共有することにしました：

var requrl = '@Url.Action("Action", "Controller", null, Request.Url.Scheme, null)';
  $.ajax({
   type: "POST",
   url: requrl,
   data: "{queryString:'" + searchVal + "'}",
   contentType: "application/json; charset=utf-8",
   dataType: "html",
   success: function (data) {
   alert("here" + data.d.toString());
   }
  });
3
Mihai Labo

URLにアクセスする簡単な方法このコードを試してください

 $.ajax({
     type: "POST",
      url: '/Controller/Search', 
     data: "{queryString:'" + searchVal + "'}",
     contentType: "application/json; charset=utf-8",
     dataType: "html",
     success: function (data) {
     alert("here" + data.d.toString());
    });
0
Rehmat Ali

mihai-labo's answerから始めて、requrl変数の宣言を完全にスキップして、URL生成コードを "url："の直前に配置してみてください。

 $.ajax({
    type: "POST",
    url: '@Url.Action("Action", "Controller", null, Request.Url.Scheme, null)',
    data: "{queryString:'" + searchVal + "'}",
    contentType: "application/json; charset=utf-8",
    dataType: "html",
    success: function (data) {
        alert("here" + data.d.toString());
    }
});
0
Mpilo Z