0

私は3つのドロップダウンを持っています。1. 国を選択 2. 学校を選択 3. コースを選択

これには次のコードがあります。

$(function () {
    $("#CountriesID").change(function () {
        $.getJSON("/Account/SchoolList/" + $("#CountriesID").val(), function (data) {
            var items = "<option>Select your school</option>";
            $.each(data, function (i, school) {
                items += "<option value='" + school.Value + "'>" + school.Text + "</option>";
            });
            $("#Schools").html(items);
        });
    });

    $("#Schools").change(function () {
        $.getJSON("/Account/CourseList/" + $("#Schools").val(), function (data) {
            var items = "<option>Select your Course</option>";
            $.each(data, function (i, course) {
                items += "<option value='" + course.Value + "'>" + course.Text + "</option>";
            });
            $("#Courses").html(items);
        });
    });
});

これはうまくいっています。ここで、誰かがこの情報を保存してプロファイル ページに再び戻ってきた場合、保存された値を選択したオプションとして表示する必要があります。

ビューバッグに保存されたスクールIDとコースIDがあります。しかし、上記のコードでビューバッグの値を SELECTED として使用するにはどうすればよいですか??

4

2 に答える 2

1

デモjsFiddle

これはこれを行う 1 つの方法にすぎず、他にも多くの方法があります。3 つのドロップダウンすべてに入力する必要があるため、国コードも送信することをお勧めします。

JS

function GetSchools(country) {
    return $.getJSON("/Account/SchoolList/" + country, function (data) {
        var items = "<option>Select your school</option>";
        $.each(data, function (i, school) {
            items += "<option value='" + school.Value + "'>" + school.Text + "</option>";
        });
        $("#Schools").html(items);
    });
}

function GetCourses(school) {
    return $.getJSON("/Account/CourseList/" + , function (data) {
        var items = "<option>Select your Course</option>";
        $.each(data, function (i, course) {
            items += "<option value='" + course.Value + "'>" + course.Text + "</option>";
        });
        $("#Courses").html(items);
    });
}

function OnSuccess(){
    if('@Html.Raw(ViewBag.courseid)' != '')
    {
        $('#Schools').val(@Html.Raw(ViewBag.courseid));
    }
}

$(function () {
    $("#CountriesID").change(function () {
        //Clears the list of Courses since the Country Changed
        $("#Courses").empty();

        //Gets the list of Schools for the new Country
        GetSchools(this.val());
    });

    $("#Schools").change(function () {
        //Gets the list of Courses for the selected school
        GetCourses(this.val());
    });

    if('@Html.Raw(ViewBag.schoolid)' != '')
    {
        $('#Schools').val(@Html.Raw(ViewBag.schoolid));
        $.when(GetCourses('@Html.Raw(ViewBag.schoolid)')).then(OnSuccess);
    }

});

2013 年 9 月 17 日 16:29 更新

于 2013-09-17T20:23:18.363 に答える
0

でコードを作成している場合はView、次のように記述できます。

$(document).ready(function(){
    var schoolID = "@ViewBag.schoolID";
    var courceID = "@ViewBag.courceID";

    $("#Schools option:selected").val(schoolID);
    $("#Course option:selected").val(courceID);
});

このコードが別の js ファイルにある場合は、hiden div を使用して ViewBags データを取得できます。

于 2013-09-17T19:16:38.110 に答える