Jquery 将$.ajax与InsertionMode.Replace一起使用

对于MVC5，我尝试使用$.ajax，因为我需要替换网页上的部分视图。使用@Ajax.ActionLink是有效的，但我不知道在Razor中如何检索输入字段值，因为@Ajax.ActionLink被表单post按钮所取代。在JavaScript中，我可以获取输入字段值，但是$.ajax方法似乎不允许像@ajax调用那样使用“InsertionMode=InsertionMode.Replace”

我的JavaScript如下所示：

$("#Filter_Form").submit(function (event) {
    $.ajax({
        type: "POST",
        url: "UpdateData",
        data: { "filter": GetParamsToSend() },
        dataType: "text",
        //InsertionMode: InsertionMode.Replace,   Doesn't work in the jQuery $.ajax
        UpdateTargetId: "PersonListDiv"
    });
});

var GetParamsToSend = function() {
    var f1 = $('input[name=SearchType]:checked').val();
    var f2 = "~";
    var f3 = $("#FilterEntry").val();
    var filter = f1.concat(f2.concat(f3));
    return filter;
};

这将使用正确的参数调用正确的控制器方法，但我不知道如何使它替换我正在处理的部分视图，应该在“PersonListDiv”位置进行替换

---

在此方面的任何帮助都将不胜感激。

在

$.ajax

中没有名为

UpdateTargetId

的选项

相反，您应该实现一个成功处理程序

success: function(response){
  //do something with the response
}

试试这个：

$("#Filter_Form").submit(function (event) {
  $.ajax({
    type: "POST",
    url: "UpdateData",
    data: { "filter": GetParamsToSend() },
    dataType: "text",
         success: function (result) {   
               $("#myPopUp").html(result); 
               $("#myPopUp").popup("open");
         },
   });
});

您只在

@Ajax.BeginForm（）

中使用UpdateTargetId，而不在JS代码中使用

---

谢谢你的例子。我做了更改，它执行了，但是表单元素刚刚清除，部分视图没有更改。为什么不用按钮链接它呢。将清除“发件人”中的所有内容，您将拥有一个新页面。不要使用

$（“#筛选表单”）。提交（函数（事件）

。创建一个链接或另一个按钮，然后尝试清除表单，这样就不会有问题。不确定“用按钮链接它”是什么意思。上面的代码已经链接到“提交”按钮。我不介意使用“@Ajax.ActionLink”，但我似乎无法从Razor代码中获取输入值。我现在知道“@Ajax.ActionLink”有效，因为我尝试通过硬编码输入值来使用它。因为当您提交所有表单时，它应该调用

操作

在您的控制器中。您能把视图的代码放进去吗。当按下提交按钮时，它首先调用索引（）方法，就像它在最初加载窗口时所做的那样，之后会调用UpdateData controller方法，因此即使它进行了额外的调用，我也不认为它会影响最终结果。也许我应该集中精力使用Razor调用而不是JQuery。

$("#Filter_Form").submit(function (event) {
  $.ajax({
    type: "POST",
    url: "UpdateData",
    data: { "filter": GetParamsToSend() },
    dataType: "text",
         success: function (result) {   
               $("#myPopUp").replaceWith(result); 
               $("#myPopUp").popup("open");
         },
   });
});