使用 jquery 从 .cshtml 页面调用控制器操作

Question

我正在尝试从 jquery UI 对话框调用控制器操作。 我目前拥有的是这样的：

.html("<p><textarea name=\"TextMessage\" id=\"textItems\" rows=\"10\" cols=\"72\" /><br /><br /><input type=\"button\" style=\"float:right;\" id=\"submitData\" onclick=\"Test()\" value=\"Submit\" /></p>");

我用来调用控制器动作的脚本是这个：

<script type="text/javascript">
    function Test() {
        $ajax({
            url: '<%= Url.Action("GetData", "Report") %>',
            success: function (data) {
                alert(data);
            }
        });
    };
</script>

控制器动作是这样的：

[HttpGet]
        public JsonResult GetData()
        {
            return Json("success", JsonRequestBehavior.AllowGet);
        }

我想知道我是否做错了什么，我试图让它工作但没有任何成功。当我尝试通过http://localhost:1322/Report/GetData 直接启动控制器时，它工作正常，这意味着脚本设置不正确。

Answer 1

你应该试试：

url:'@Url.Action("GetData", "Report")'

MVC在寻找控制器时，会自动在第二个参数末尾添加“Controller”。

编辑：

此代码可能有效：

function Test() {
    $.ajax({
        type: "GET",
        dataType: "json",
        url: '@Url.Action("GetData", "Report")',
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            alert(data);
        },
        error: function(xhr, status, error) {
            alert(error);
        }
    });
}

编辑 2：

更改为使用 Razor 语法，以便此代码适用于 Razor/MVC3。

Answer 2

您在 Url.Action 上使用 MVC-2 语法。这应该有效：

function Test() {
  $.ajax(
    {
      url: '@Url.Action("GetData", "Report")',
      dataType: 'json',
      success: function (data) {
        alert(data);
      },
      error: function (x, err, desc) {
        alert(desc);
      }
    }
  );
};

Answer 3

因为您正在调用一个返回json 对象的操作方法，所以您可以使用jQuery.getJSON() 方法。

<script type="text/javascript">
    function Test() {
        $.getJSON(
            '@this.Url.Action("GetData", "Report")',
            function (data) {
                alert(data);
            }
        });
    };
</script>

Answer 4

你也可以试试 jsaction： http://jsaction.codeplex.com

Answer 5

我们可以很方便地使用Javascript/Jquery调用Controller方法，如下：

假设以下是要调用的 Controller 方法，该方法返回一些类对象的数组。设类为'A'

public JsonResult SubMenu_Click(string param1, string param2)

    {
       A[] arr = null;
        try
        {
            Processing...
           Get Result and fill arr.

        }
        catch { }


        return Json(arr , JsonRequestBehavior.AllowGet);

    }

下面是复杂类型（类）

public class A
 {

  public string property1 {get ; set ;}

  public string property2 {get ; set ;}

}

现在轮到 JQUERY 调用上面的控制器方法了。以下是调用控制器方法的Jquery函数。

function callControllerMethod(value1 , value2) {
    var strMethodUrl = '@Url.Action("SubMenu_Click", "Home")?param1=value1  &param2=value2'
    $.getJSON(strMethodUrl, receieveResponse);
}


function receieveResponse(response) {

    if (response != null) {
        for (var i = 0; i < response.length; i++) {
           alert(response[i].property1);
        }
    }
}

在上面的Jquery函数'callControllerMethod'中，我们开发了控制器方法url，并把它放在一个名为'strMehodUrl'的变量中，然后调用Jquery API的getJSON方法。 p>

receieveResponse 是接收控制器方法的响应或返回值的回调函数。

这里我们使用了 JSON ，因为我们不能使用 C# 类对象

直接进入javascript函数，所以我们将controller方法中的结果（arr）转换成JSON对象如下：

Json(arr , JsonRequestBehavior.AllowGet);

并返回该 Json 对象。

现在在 Javascript / JQuery 的回调函数中，我们可以利用这个结果 JSON 对象并相应地在 UI 上显示响应数据。

更多详情 click here