如何在下拉淘汰赛js中预先选择一个选项 [英] How to pre-select an option in a dropdown knockout js

问题描述

我查看了另一个问题，但无法让我的选择框正常工作:绑定下拉(选择)列表的初始/默认值

I've looked at this other question, but can't get my select box to work correctly: Binding initial/default value of dropdown (select) list

我有以下游戏对象:

function Game(visitingTeamDetails, homeTeamDetails, game) {
if (arguments.length > 0) {
    this.VisitingTeamDetails = visitingTeamDetails;

    this.HomeTeamDetails = homeTeamDetails;

    this.GameId = ko.observable(game.GameId);
    this.HomeTeamName = ko.observable(game.HomeTeamName);
    this.VisitingTeamName = ko.observable(game.VisitingTeamName);
    this.SportTypeName = ko.observable(game.SportTypeName);
    this.HomeAccountName = ko.observable(game.HomeAccountName);
    this.VisitingAccountName = ko.observable(game.VisitingAccountName);
    this.GameDateString = ko.observable(game.GameDateString);
    this.GameTimeString = ko.observable(game.GameTimeString);
    this.AvailableSportTypes = ko.observableArray(game.Sports);

    this.sportTypeFunction = function () {
        for (sportType in this.AvailableSportTypes()) {
            if (this.AvailableSportTypes()[sportType].Name == this.SportTypeName()) {
                return this.AvailableSportTypes()[sportType];
            }
        }
        return null;
    };

    this.SportType = ko.observable(game.SportType);
}
}

SportType 是一个带有 Name 和 SportTypeId 的对象.

SportType is an object with Name and SportTypeId.

我有以下模板:

 <td rowspan="3"><select data-bind="options: AvailableSportTypes, value: SportType, optionsText:'Name', optionsCaption: 'Choose...'" class="sportType"></select></td>

AvailableSportTypes 是 SportType 的列表.

该列表在下拉列表中带有 SportType 的名称，但我无法将初始选择设为 SportType.我编写了 sportTypeFunction 来向自己表明数据正确输入，它会选择正确的值，但更改我在下拉列表中的选择不会更新 SportType.

The list is coming in with the names of the SportTypes in the drop down list, but I can't make the initial selection be SportType. I wrote sportTypeFunction to show myself that the data was coming in correctly, and it would select the correct value, but changing my selection in the drop down would not update SportType.

我确定我做错了什么.有人看到了吗?

I'm sure I'm doing something wrong. Anyone see it?

谢谢

推荐答案

当 game.SportType 被传入时，它需要是对 game.AvailableSportTypes 中的一个项目的引用 而不仅仅是看起来相同的对象.

When game.SportType gets passed in, it needs to be a reference to the an item in the game.AvailableSportTypes and not just an object that looks the same.

基本上两个对象是不相等的，除非它们实际上是对同一个对象的引用.

Basically two objects are not equal unless they are actually a reference to the same object.

var a = { name: "test" },
    b = { name: "test" }; 

    alert(a === b); //false

因此，您需要调用函数以在数组中定位正确的对象并将其设置为可观察对象的值.

So, you would need to call your function to locate the correct object in the array and set it as the value of your observable.

并不是说它更好，但是在 KO 1.3 中，您可以扩展 observables、observableArrays 和dependentObservables 的 .fn 以添加额外的功能.

Not that it is way better, but in KO 1.3 you can extend .fn of observables, observableArrays, and dependentObservables to add additional functionality.

这是一个示例:http://jsfiddle.net/rniemeyer/ZP79w

这篇关于如何在下拉淘汰赛js中预先选择一个选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！