0

各位晚安。我对 knockout.js 有这个问题。我正在使用表格过滤表单，它有 2 个下拉列表，一个父级和一个子级。该表由下拉列表之一或两者过滤。但是，如果我更改第一个下拉列表，第二个将通过 ajax 调用进行过滤。问题是，当页面加载到 html 上时，应该填充两个下拉列表。正在恢复。我要做的是从填充的下拉列表中过滤或删除现有选项，并填充过滤后的选项。

到目前为止的代码：

HTML（它是一个 Blade 模板，它可以很好地渲染 html，编辑：这些值不是真正的值，只是放一些）

    <div class="span3">
        <div class="control-group">
            <label class="control-label">messages.form_elemento_dependencia:</label>
            <select name="f_dependencia" data-bind="value: dependencia" id="f_dependencia" class="span12 campos_busqueda_bienes">
                <option value="A">A</option>
                <option value="B">B</option>
                <option value="C">C</option>
            </select>
         </div>
     </div>

<div class="span3">
    <div class="control-group">
        <label class="control-label">messages.form_elemento_coordinacion:</label>
        <select id="options:coordinacionData, optionsText: "description",optionsCaption: "Seleccione", optionsValue: "id", value: coordinacion" class="span12 campos_busqueda_bienes" name="f_coordinacion">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
        </select>
     </div>
</div>

JS（我知道我还没有找到的协调数据数组缺少一些东西）

var ViewModel = function() {
            var self = this;
            self.dependencia = ko.observable();
            self.coordinacion = ko.observable();
            self.descripcion = ko.observable();
            self.dt = _sitiosDt;

            self.coordinacionData = ko.observableArray([]);

            self.bienes_t = ko.observableArray([]);

            self._filtra_dt = function(){
                _sitiosDt.fnDraw();
            };

            self.filtra_dt_click = function(data, event){
                self._filtra_dt();
            };

            self.filtra_dt = function(data, event){
                if(event.keyCode == 13){
                    self._filtra_dt();
                }
                return true;
            };

            self.limpia_campo_busqueda = function(){
                self.dependencia('');
                self.descripcion('');
            };

            self.dependencia.subscribe(function(newDependencia) {
                if(newDependencia){
                    $.getJSON("/coordinacionesjson", {'d':newDependencia}, function(data) {
                        var mappedData = $.map(data, function(item) { return new Item(item.id, item.description) });
                        self.coordinacionData(mappedData);
                    });
                    self.coordinacion('');
                }
            });



        };
        my = {viewModel : new ViewModel(_sitiosDt)};
        ko.applyBindings(my.viewModel);
4

0 回答 0