Comment puis-je lier le texte sélectionné d'une zone Sélectionner à l'attribut d'un objet avec knock-out JS, ou toute autre chose?

Question

J'ai un pull boîte de sélection vers le bas que je peuplant une liste JSON retournée à partir d'une procédure stockée, mais malheureusement, quand je mets à jour l'objet lié je dois retourner le texte dans le menu déroulant , pas l'indice sélectionné comme on pourrait penser (mauvaise conception de base de données, mais je suis coincé avec elle pour l'instant et ne peut pas le changer).

Est-ce que quelqu'un a des idées ce que je peux faire pour garder le texte sélectionné synchronisé avec l'attribut de l'objet javascript approprié?

Answer 1

Alors oui, vous avez obtenu ce que je voulais en venir. Utilisez le texte comme la valeur pour les options de sélection plutôt que d'utiliser un index. La valeur doit vraiment être quelque chose d'utile, je ne peux pas penser à tous les cas où j'ai jamais utilisé un index. Un nombre sûr, mais un nombre qui concerne les modèles de l'application d'une certaine façon (comme un identifiant à partir d'une base de données), et non au nombre d'éléments dans la boîte de sélection.

Et bien fait.

Answer 2

Vous pouvez garder les deux, la valeur et le texte, si vous utilisez abonnés. Par exemple, si chacun de vos objets javascript ressembler à ceci:

    var optionObject = {
       text:"text1"
       value: 1
    }

Ensuite, votre fixation ressemblerait à ceci:

Où 'OptionsObjects' est une collection de optionObject et selectedOption a deux propriétés observables: le texte et la valeur. Enfin vous êtes abonné à la propriété de valeur de la selectedOption:

    viewModel.selectedOption.value.subscribe(function(newValue){
        var optionText = viewModel.OptionsObjects[newValue].text;
        viewModel.selectedOption.text(optionText);
    });

Alors si vous voulez voir le nouveau texte de l'option sélectionnée lorsque la valeur est modifiée, vous pourriez avoir une liaison de la manière suivante:

    <span data-bind:"text:selectedOption.text"></span>

Dans votre cas, vous reviendriez selectedOption.text ().