2

私は Knockoutjs に精通しており、入力選択でサービス呼び出しを実行しようとしています。

オブジェクトは次のようになります。

var teamViewModel = {
    teams: ko.observableArray([]),
    clearTeams: function(){
        this.teams.removeAll();
    },
    addTeam: function (id, name, isChecked) {
        t = new team(id, name, isChecked);
        this.teams.push(t);
    }
};

選択ボックスは、これを呼び出すことによって取り込まれています:

function GetAvailableTeams() {

    var jqxhr =
    $.getJSON('http://localhost/Service.svc/GetTeamsAll',
    function (data) {
        teamViewModel.clearTeams();
        $.each(data.GetTeamsAllResult, 
        function (key, val) {
            teamViewModel.addTeam(val.TeamId, val.TeamName, true);
        });
        ko.applyBindings(teamViewModel, document.getElementById("teamNameLabel"));
    })
}

この関数はページロード時に呼び出され、次のように参照されます。

<select id="teamNameLabel" date-theme="f" data-bind="options: teams,  optionsText: 'name', value: 'id'"></select>

select ステートメントのオプションが選択されたときにグローバル変数 TeamId を更新するにはどうすればよいですか?

編集：

function GetAllUsersByTeam(){

var url = 'http://localhost/Service.svc/GetUsersByTeam/'+TeamId;

        var jqxhr =
        $.getJSON(url,
        function (data) 
        { 
            colleagueViewModel.clearColleagues();
            $.each(data.GetUsersByTeamResult, function (key, val) {
                colleagueViewModel.addColleague(val.FirstName, val.LastName, val.EmailAddress, val.PhoneNumber, val.LocationName, val.CapabilityId, val.CoeId);
            });
            ko.applyBindings(colleagueViewModel, document.getElementById("colleaguesListView"));
        })
    }
4

1 に答える 1

1

グローバル変数を使用する必要はありません。selectedTeam選択したオプションを表すオブザーバブルをビュー モデルに追加できます。

var teamViewModel = {
    teams: ko.observableArray([]),
    selectedTeam: ko.observable(),
    // ...
}

次に、オプションを にバインドします 。つまり、次のvalueようになります。selectedTeam

<select data-bind="options: teams,  optionsText: 'name', value: selectedTeam">
</select>

最後にid、選択したオプションの にアクセスするには、 を使用しますteamViewModel.selectedTeam().id。

ここにデモがあります。

于 2012-10-22T16:03:40.803 に答える