如何在MVC动态绑定html.DropDownList（） [英] How to dynamic bind html.DropDownList() in MVC

问题描述

我有一个DropDownList，并在我的网页文本框，我想改变的文本框变化的DropDownList。我使用JQuery后是这样的：

I have a dropdownlist and a textbox in my page,I want to change the dropdownlist with the textbox change. I use JQuery post like this:

$（＃txtBuildId）。改变（函数（）{
        变种的创建日期= $（＃txtBuildId）VAL（）。
            $。员额（/ UTOverview /索引的创建日期=+的创建日期）;
        }）;

和我的索引功能是：

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();
    }

但是我发现，DropDownList的不与数据视图[tbbuildid]的变化而变化？为什么呢？

But I found that the dropdownlist didn't change with the DataView["tbbuildid"] change? Why ?

我试着通过完全回发的方法来做到这一点，如：？/ UTOverview /索引的创建日期= window.location的= +的创建日期; 它的工作原理。计算机[tbbuildid]改我每次发布新的创建日期的方法index.But时间我如何通过Ajax的方式做到这一点？

I try to do this via full postback way like: window.location = "/UTOverview/Index?builddate=" + builddate; It works. ViewData["tbbuildid"] changed every time I post the new builddate to the method index.But how can I do this by Ajax way?

推荐答案

在你的行动方法，在返回查看，但你有这样的看法？在这种情况下，我会简单地从动作方法返回JSON。

In your Action method, you are returning a View, But do you have a view for this ? In this case, I would simply return Json from the action method.

刚刚从动作方法返回的Json 并用它来填充dropdow。既然你正在一个HTTP POST调用，它会打你的 HTTPPost 操作方法

Just return Json from your Action method and use that to populate your dropdow. Since you are making an Http Post call, It will hit your HTTPPost Action method

[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辅助去操作方法路径作为MVC将采取正确的路径返回到行动照顾好习惯方法。你不需要担心多少 ../ 使用。

It is always a good practice to use Url.Action HTML helper to get the path to the Action method as MVC will take care of returning the correct path to the action method. You dont need to worry about how many ../ to use.

以上code测试，它会正常工作。

The above code is tested and it will work fine.

这篇关于如何在MVC动态绑定html.DropDownList（）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！