0

我的页面中有一个下拉列表和一个文本框,我想通过文本框更改来更改下拉列表。我使用这样的 JQuery 帖子:

$("#txtBuildId").change(function() { var builddate = $("#txtBuildId").val(); $.post("/UTOverview/Index?builddate=" + builddate); });

我的索引函数是:

public ActionResult Index()
    {
        string buildDate = Request.Params.Get("builddate");
        DataTable tbBuildid = DatabaseService.getBuilidByDate(buildDate);
        List<SelectListItem> list = new List<SelectListItem>();
        foreach (DataRow bd in tbBuildid.Rows as IEnumerable)
        {
            list.Add(new SelectListItem { Text = bd["buildid"].ToString(), Value = bd["buildid"].ToString() });
        }
        ViewData["tbbuildid"] = list;
        return View();
    }

但是我发现下拉列表没有随着 DataView["tbbuildid"] 的改变而改变?为什么 ?

我尝试通过完整的回发方式来做到这一点,例如:window.location = "/UTOverview/Index?builddate=" + builddate;它有效。每次我将新的 builddate 发布到方法 index 时,ViewData["tbbuildid"] 都会发生变化。但是我怎样才能通过 Ajax 方式做到这一点?

4

3 回答 3

1

在您的 Action 方法中,您正在返回一个视图,但是您对此有视图吗?在这种情况下,我会简单地从 action 方法中返回 Json。

只需Json从您的 Action 方法返回并使用它来填充您的下拉菜单。由于您正在进行 Http Post 调用,它会命中您的HTTPPostAction 方法

[HttpPost]
public ActionResult Index()
{
        string buildDate = Request.Params.Get("builddate");
        DataTable tbBuildid = DatabaseService.getBuilidByDate(buildDate);
        List<SelectListItem> list = new List<SelectListItem>();
        foreach (DataRow bd in tbBuildid.Rows as IEnumerable)
        {
            list.Add(new SelectListItem { Text = bd["buildid"].ToString(), Value = bd["buildid"].ToString() });
        }
        return Json(list);
}

在你的剧本中,

    $("#txtBuildId").change(function () {
        var builddate = $("#txtBuildId").val();
        $.post("@Url.Action("Index","UTOverview")", {builddate:builddate},function(data){
          $.each(data, function() {
                $("#select1").append($("<option />").val(this.Value).text(this.Text));
         });
        }); 
     });

Url.Action使用HTML 帮助程序获取 Action 方法的路径始终是一个好习惯,因为 MVC 将负责返回到 action 方法的正确路径。您无需担心../要使用多少。

上面的代码已经过测试,可以正常工作。

于 2012-04-09T12:35:38.023 回答
0

您是否尝试调试您的 cs 代码并在您的 javascript 代码中添加警报。

尝试这样做,您应该更接近实际问题,并将这些发现发布在您的问题中。

于 2012-04-09T11:50:21.363 回答
0

jquery .post() 实际上是对服务器的异步调用。它返回一些数据,然后您需要对其进行处理。

如果您只是想通过完整的回发来刷新您的页面,您可以这样做

window.location = "/UTOverview/Index?builddate=" + builddate;

如果您想动态更改下拉菜单的状态,而无需刷新页面,您需要将回调传递给 .post() ,它会根据返回的数据更新下拉框。在这种情况下,您不想让它调用您的索引操作,而是一个用于检索更新数据的特定操作。例如:

$.post("/UTOverview/BuildSelect?builddate=" + builddate, function(data) {
  $('#buildDropDown').html(data);
});

有关更多信息,请参阅jQuery.post()。或者,与其在控制器操作中构建 HTML(这有点不妥),不如返回一个 Json 结果并将您的下拉列表绑定到此。

在这两种情况下,请注意监听 onchange 事件只会在文本框失去焦点时触发。

于 2012-04-09T11:56:35.090 回答