在淘汰赛中处理下拉列表更改的事件

handling events on drop downlist change in knockout

我看到 this example 的下拉更改事件并尝试了但无法让它工作。希望得到一些帮助..

我的html:

<div data-bind="with: g">

            <div><input type="text" class="form-control" data-bind="value: gname" /></div>

            <div>
                <table>

                    <tbody>
                        <tr data-bind="with:gdetails">
                            <td>
                                <select data-bind="options: eventschemas, optionsText: 'schema', value:eventschemacondition().schema, event: {change: setschema}"></select>

                            </td>

                        </tr>
                    </tbody>
                </table>
                <pre data-bind="text: ko.toJSON($data, null, 2)"></pre>
            </div>
        </div> 
    </div>

我的javascript:

 var eventschemas = [{ "schema": "Test" }, { "schema": "Another Test" }];

        var AppScope = function () {
            function EventSchemaCondition(data) {
                this.schema = ko.observable(data.schema);

                this.setschema = function () {
                    console.log("event fired");

                };
            }

            function Gdetails(data) {
                this.eventschemacondition = ko.observable(data.eventschemacondition);
            }

            function G(data) {
                this.gname = ko.observable(data.gname);
                this.gdetails = ko.observable(data.gdetails);
            }

            function GsViewModel() {
                var self = this;
                self.g = ko.observable(
                new G({
                    gname: "",
                    gdetails: new Gdetails({ eventschemacondition: new EventSchemaCondition({ schema: "" }) })
                }));
            }

            ko.applyBindings(new GsViewModel());
        }();

我收到的错误:

消息:无法处理绑定 "event: function (){return {change:setschema} }"

消息:setschema 未定义

谢谢

只是一个简单的更改,您只需要像这样设置 setschema eventschemacondition().setschema 因为 setschema 不直接在 getdetails 下。

查看:

 <select data-bind="options: eventschemas, optionsText: 'schema', value:eventschemacondition().schema, event: {change:eventschemacondition().setschema}"></select>

工作Fiddlehere