2012-10-09 1 views
5

funktioniert Ich habe ein paar Auswahlfelder, die unregelmäßig in IOS handeln. Ich führe cordova 1.8.1 aus und lasse eine knockout.js Anwendung auf meiner Seite laufen. Wenn ich ein Element in der Elementauswahl auswähle, wird es ausgewählt, aber auch alle anderen Elemente in der Liste. Nun, soweit ich das beurteilen kann, wird das richtige Element ausgewählt und gemeldet, wenn ich das Formular abschicke, aber es sieht wirklich sehr schlecht für den Benutzer aus und könnte sehr verwirrend sein. Ich mache nichts Besonderes, hier ist der Code:Knockout.js Liste auswählen, die unregelmäßig auf ios

<select class="dropdownList1" style='width:35%;left:28%;position:absolute;' data-bind="value:ContactUsForm.Month,options:ContactUsForm.Months,optionsCaption: 'Month'"></select> 

Aber hier ist das Ergebnis, wenn ich 7 für den Monat wählen:

enter image description here

Dies ist kein muti Auswahlbox. Es scheint mir, dass der Fehler hier in iOS ist, aber mein Verdacht ist, dass Knockout auch etwas Rendern macht, wenn ich einen Wert auswähle. In normalen Browsern schnappt die Box zu, so dass Sie nie einen "Zwischenzustand" sehen, aber mit ios bleibt die Box geöffnet, bis Sie auf "Fertig" klicken.

+0

Dieses Problem auf unserer Website auch geschieht. Irgendwelche Lösungen oder Workarounds bisher? –

+0

Was passiert, wenn Sie die Bindung "Wert" entfernen? –

+0

Wenn Wert Bindung entfernt wird, hat es dieses Rendering-Problem nicht !! –

Antwort

5

Dieses Problem wird verursacht, wenn Knockout die Elemente in der Dropdownliste aktualisiert. Aber selbst wenn ContactUsForm.Months sich niemals ändert, aktualisiert Knockout die Elemente immer noch, wenn sich der Wert ändert, etwa wenn Sie ein Element auswählen. Weitere Informationen zu diesem Problem finden Sie im Artikel RP Niemeyer im Artikel Knockout.js Performance Gotcha #3 - All Bindings Fire Together.

Ich denke eine Lösung, die er dort präsentiert, wird für Sie arbeiten. Anstatt die options Bindung zu verwenden, sollten Sie seine isolatedOptions Bindung verwenden. (Auch die value Bindung immer nach options oder isolatedOptions sein sollte.)

<select data-bind=" 
    isolatedOptions:ContactUsForm.Months, optionsCaption:'Month', 
    value:ContactUsForm.Month"></select> 
+0

Danke für den Vorschlag Michael. Ich werde es versuchen –

+0

Getestet und es wurde das Problem behoben –

+0

Knockout 2.3.0 oder 3.0.0 Beta sollte dies beheben, ohne dass Sie Ihren Code ändern müssen. –