2012-10-22 61 views
2

我非常瞭解Knockoutjs,並且我試圖在輸入select上執行服務調用。通過選擇更新變量

我的對象是這樣的:

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

回答

1

沒有必要使用全局變量。您可以添加selectedTeam可觀察到您的視圖模型,代表所選擇的選項:

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

,然後bind the options'valueselectedTeam,那就是:

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

最後,訪問的id選定的選項,只需使用teamViewModel.selectedTeam().id即可。

這裏是一個DEMO

+0

我想使用全局變量的原因是因爲我給團隊的所有成員調用了另一個函數,我會將該函數添加到原始文章 – Mike

+0

@Mike:我明白了,但答案保持不變,但而不是在'GetAllUsersByTeam'函數中使用'TeamId'使用'teamViewModel.selectedTeam().id',其優點是所選擇的可觀察團隊由'ko'管理。 –

+0

我可以將ID初始化爲1嗎? – Mike