【问题标题】:Jquery autocomplete httppost actionresult not loading after ajax postJquery自动完成httppost actionresult在ajax发布后未加载
【发布时间】:2016-09-16 11:30:52
【问题描述】:

所以我一直在搜索堆栈数小时,似乎无法找到解决方案。我正在尝试实现基本的 jquery 自动完成功能,但是当我单击/选择自动完成下拉列表中的项目以将我发送到新页面时,我的 httppost actionresult 没有返回视图。它通过 httppost 控制器运行良好(所有参数都被传递,查询运行,模型被传递给视图等)。我很确定这是由于我的 ajax 帖子中的window.location.reload();,但似乎无法弄清楚这一点。我也试过window.location.href = link;,但这也不起作用。请帮忙:(

JS

$("#queryTypeInput").autocomplete({
  source: "/Dashboard/EnterMatterFormAjax/",
  select: function (event, ui) {                
    var inputVal = ui.item.value.substring(0, 10);                            

    $.ajax({type:"POST",
    url:"Dashboard",
    data:{ queryType: queryTypeval }, 
    success: function (result) {
      window.location.reload(); //this is where i think the issue is 
    }
  })
});

EnterMatterFormAjax 控制器(工作正常)

public JsonResult EnterMatterFormAjax(string term)
    {
        var termReq = Request["term"];            
        var termReq2 = "";
        if (termReq.All(char.IsDigit))
        {
            termReq2 = termReq + "%";
        }
        else
        {
            termReq2 = "%" + termReq + "%";
        }
        var ajaxMatterData = GetAjaxMatterData(termReq2);

        return Json(ajaxMatterData, JsonRequestBehavior.AllowGet);
    }

索引控制器(工作正常)

[HttpPost]
    public ActionResult Index(string queryType)
    {
        ...goes through code logic...
        return View();
    }

【问题讨论】:

  • 为什么在自动完成选择事件中使用window.location.reload();?你想重新加载页面吗?
  • 您要导航到的新页面是什么?你想传递什么数据给它?
  • @Shyju 选择后,我希望页面加载 [HttpPost]Actionresult 索引中的信息。重新加载只是我最后一次失败的尝试。
  • 当你从下拉列表中选择一个项目时,使用 window.location.href = "/dashboard/index?queryType=" + queryTypeval
  • @KarthikMR 出于某种原因,window.location.href不是在视觉工作室中担任职位吗?不知道为什么。我编辑的答案虽然解决了我的问题

标签: javascript jquery ajax asp.net-mvc autocomplete


【解决方案1】:

我只是在自动完成选择后重新提交了我的表单,而不是像@KarthikMR 提到的那样使用window.location.href。我将不得不改变我的控制器操作,所以我只采取了最简单的方法。 @KarthikMR 的建议在我改变行为时确实有效,所以这是一个可行的选择!更新js如下:

$("#queryTypeInput").autocomplete({        
source: function (request, response) {
    $.post("Dashboard/EnterMatterFormAjax", request, response);            
},
select: function(event, ui){            
    $("#queryTypeInput").val(ui.item.value);
    $("#enterMatterForm").submit();
}
});

【讨论】:

  • 好吧!但是您的 url 必须指向 /dashboard 才能工作,因为您会将数据发布到同一个表单。如果您不想要这个限制,您可以使用建议和测试的方法。
猜你喜欢
  • 2017-07-05
  • 1970-01-01
  • 2011-09-28
  • 1970-01-01
  • 2020-07-07
  • 2011-07-25
  • 2014-11-28
  • 2013-06-02
  • 1970-01-01
相关资源
最近更新 更多