Question

我正在尝试创建级联下拉框，第一个下拉框应填充电影标题第二个下拉框应填充与电影标题关联的日期。我建立了一对多的关系。

这是我使用数据库第一种方法生成的模型：

public partial class MovieDetail
{     
    public MovieDetail()
    {
        this.MovieDates = new HashSet<MovieDate>();
    }

    public int Id { get; set; }
    public string Title { get; set; }
    public string Director { get; set; }
}

public partial class MovieDate
{
    public MovieDate()
    {
        this.Times = new HashSet<Time>();
    }

    public int MovieDateId { get; set; }
    public string Date { get; set; }
    public int MovieDetailsId { get; set; }

    public virtual MovieDetail MovieDetail { get; set; }
}

在我的控制器中：

public class MovieWhatsOnController : Controller
{
    public MovieEntities1 db = new MovieEntities1();

    // GET: MovieWhatsOn
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult TitleList(int MovieDetailsId)
    {
        var title = from s in db.MovieDetails
                    where s.Id == MovieDetailsId
                    select s.Title;

        if (HttpContext.Request.IsAjaxRequest())
        {
            return Json(new SelectList(db.MovieDetails, "Id", "Title"), JsonRequestBehavior.AllowGet);
        }
        else
        {
            return View(title);
        }

    }

    public ActionResult DateList(int moviedetailsid)
    {
        var date = from s in db.MovieDates
                   where s.MovieDateId == moviedetailsid
                   select s.Date;

        if (HttpContext.Request.IsAjaxRequest())
        {
            return Json(new SelectList(db.MovieDates, "MovieDateId", "Date"), JsonRequestBehavior.AllowGet);
        }
        return View(date);
    }
}

这是我的观点：

@model MovieApp.Models.MovieDetail
@{
    ViewBag.Title = "Index";
    <script src="~/Scripts/jquery-3.1.1.min.js"></script>
}

@section scripts {
<script type="text/javascript">
    $(function () 
    {
        $.getJSON(" MovieWhatsOn/TitleList", function (data) {
            var items="<option>-----</option>";
            $.each(data,function(i,title){
                items+="<option value'" +title.Value +"'>" +title.text +"</option>";

            });

            $("#Titles").html(items);
        });

        $("Titles").change(function(){
            $.getJSON(" MovieWhatsOn/DateList" + $("#Titles > option:selected").attr("value"), function (data){
                var items="<option>-----</option>";
                $.each(data,function(i,date){
                    items+="<option value'" +date.Value +"'>" +date.text +"</option>";

                });

                $("#Dates").html(items);
            });
        });
    });
</script>
}
<h2>Index</h2>

@using (Html.BeginForm())
{
    <label for="Titles">Title</label>
    <select id="Titles" name="Titles"></select>
    <br /><br />
    <label for="Dates">Dates</label>
    <select id="Dates" name="Dates"></select>
    <br /><br />
    <input type="submit" value="submit" />

}

当标题和日期没有填充下拉列表时。

我真的不确定我出错了。我是JSON和MVC的新手。

非常感谢您的努力！谢谢你的时间。

json，ASP.NET MVC，创建级联下拉列表

0 个答案: