使用 Ajax.ActionLink 传递用户输入并设置 url 参数

Question

好吧，我只想在不使用显式 jquery ajax 方法的情况下传递用户输入。我的想法如下：尝试使用 Ajax.ActionLink 并在 ajax-itself 之前为 ajax 设置必要的参数：

@Ajax.ActionLink("Call date", "CallingHistory", "Member", new {sortOrder = ViewBag.DateSortParam, pageNumber = ViewBag.PageNumber}, new AjaxOptions {UpdateTargetId = "historytable", HttpMethod = "get", OnBegin = "SetUrlParameters"}, new {id = "calldatetimelink"})

以及用于设置动作的 Url 参数的 js 代码：

<script>
function setUrlParameters() {
    var k = 0;
    this.href = this.href + "?includedialling=" + $("#chBox1").val();
    this.href = this.href + "?includeincomingmissedcalls=" + $("#chBox2").val();
    this.href = this.href + "?includeoutcomingmissedcalls=" + $("#chBox3").val();
}
</script>

动作方法签名如下：

 public Task<ActionResult> CallingHistory(string sortOrder, int pageNumber, bool? includedialling,
        bool? includeincomingmissedcalls, bool? includeoutcomingmissedcalls){...}

请注意，js-method 在 ajax-request 之前执行。有可能这样做吗？我一直想为 js-method 设置断点但在 chrome web-tools 中看不到它。提前致谢。

更新： 是的，认为这应该可行，但我更改了参数的脚本原因以无限方式添加：

function setUrlParameters(data) {
    var oldref = data.href;
    var par1 = '&includedialling=' + $("#chBox1").is(":checked");
    var par2 = '&includeincomingmissedcalls=' + $("#chBox2").is(":checked");
    var par3 = '&includeoutcomingmissedcalls=' + $("#chBox3").is(":checked");

    var arr = data.href.split('&');
    var resultUrl = arr[0] + arr[1] + par1 + par2 + par3;
    $("#calldatetimelink").href = resultUrl;
}

在 chrome web-tools 中出现错误：

GET localhost:50307/Views/Shared/Partial/Member/CallingHistory.cshtml?X-Requested-With=XMLHttpRequest&_=1409287722659 404（未找到）

脚本中的调试器显示 resultUrl 变量的值：

//localhost:50307/Member/CallingHistory?sortOrder=datepageNumber=1&includedialling=false&includeincomingmissedcalls=true&includeoutcomingmissedcalls=false。 - 一切都很好。但最终我还没有得到结果。这个字符串“X-Requested-With=XMLHttpRequest&_=1409287722659”是从哪里出现的？显然，这是浏览器的行为。

Answer 1

是的..在您的问题中，您以正确的方式调用setUrlParameters，但是您在setUrlParameters 函数中使用this，并且您没有提供它而是这样做：

@Ajax.ActionLink("Call date", "CallingHistory", "Member", new {sortOrder = 
ViewBag.DateSortParam, pageNumber = ViewBag.PageNumber}, new AjaxOptions 
{UpdateTargetId = "historytable", HttpMethod = "get", OnBegin = 
"SetUrlParameters(this)"}, new {id = "calldatetimelink"})

<script>
function  setUrlParameters(data) {
  var link;
  link = data.href + "&includedialling=" + $("#chBox1").is(':checked') + "&includeincomingmissedcalls=" + $("#chBox2").is(':checked') + "&includeoutcomingmissedcalls=" + $("#chBox3").is(':checked');
  $("#calldatetimelink").attr('href',link)
}
</script>

不要忘记在您的页面或布局页面中包含'jquery.unobtrusive-ajax.min.js' 文件。