在MVC中使用JavaScript从字符串类型参数调用操作

Question

我在控制器中有下面的动作：

public ActionResult ShowContactTel(string tel)
{
    return PartialView("ContactInfoView", tel);
}

我通过JavaScript调用上述操作，如下所示：（单击按钮将其触发）

function ShowTel(){
    var e="@Model.TelShow";
    $.get("ViewProfile/ShowContactTel", e).then(
        function (r) {
            $('#divTel').innerHTML = r;
        });
}

但是action的输入参数接收到空值（通过设置断点），因此返回不期望的输出。

备注1：

我尝试了ShowTel()函数的以下代码，但结果未更改：

var str = "@Model.TelShow";
$.ajax({
    type: 'GET',
    url: '@Url.Content("~/ViewProfile/ShowContactTel")',
    data: str,
    success: function (dd) {
        $('#divTel').innerHTML = dd;
    }
});

和

var str = "@Model.TelShow";
$.ajax({
    url: "ViewProfile/ShowContactTel",
    type: 'GET',
    data: str
}).then(function (r) {
    $('#divTel').innerHTML = r;
});

我也尝试type: 'POST'但它也无法正常工作。

备注2：

在ShowTel()函数中使用debugger命令，我看到@Model.TelShow具有真实值。

问题是什么？

Answer 1

您当前的代码（第一种方法）是将e变量的值作为$.get调用的数据参数传递。 jQuery $.get方法会将其作为查询字符串值发送。 因此，您的代码正在像下面的URL一样进行get调用。

/ViewProfile/howContactTel?testValue

假设testValue是变量e的值

您的操作参数名称是tel 。 因此，发送具有该名称的属性的js对象。

还可以使用jquery html方法更新div的内部html。

$.get("/ViewProfile/ShowContactTel", { tel: e })
 .then(function (r){
       $('#divTel').html(r);
  });

我还建议您使用Url帮助器方法为action方法生成正确的相对URL。

var url = "@Url.Action("ShowContactTel","ViewProfile");
$.get(url, { tel: e }).then(function (r){
    $('#divTel').html(r);
});