Question

我正在使用推荐的自定义绑定来使数据表与knockout绑定，但是，我一直在努力让YADCF插件运行。它运行时没有错误但无法显示任何内容。我已经测试了一个简单的直接html表，似乎运行正常，过滤器显示。我尝试将YADCF init函数放在init和更新敲除绑定的函数中无济于事。有谁知道如何正确地使这个功能？似乎无法找到让这三者发挥得更好的任何参考。

YADCF版本：0.9.1

DataTables版本：1.10.15

淘汰赛版本：3.4.0

要求版本：2.2.0

<tbody data-bind="dataTablesForEach: { data: SubDetails, options: { destroy: true, bAutoWidth: false } }">

ko.bindingHandlers.dataTablesForEach = {
            page: 0,                
            init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
                var binding = ko.utils.unwrapObservable(valueAccessor());
                ko.unwrap(binding.data);
                if (binding.options.paging) {
                    binding.data.subscribe(function(changes) {
                        var t = $(element).closest('table');
                        var table = t.DataTable();                     
                        ko.bindingHandlers.dataTablesForEach.page = table.page();
                        table.destroy();
                    }, null, 'arrayChange');
                }
                var nodes = Array.prototype.slice.call(element.childNodes, 0);
                ko.utils.arrayForEach(nodes, function(node) {
                    if (node && node.nodeType !== 1) { node.parentNode.removeChild(node); }
                });                     

                return ko.bindingHandlers.foreach.init(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext);
            },
            update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
                var binding = ko.utils.unwrapObservable(valueAccessor()), key = 'DataTablesForEach_Initialized';
                ko.unwrap(binding.data);
                var table;
                if (!binding.options.paging) {
                    table = $(element).closest('table').DataTable();
                    table.destroy();
                }
                ko.bindingHandlers.foreach.update(element, valueAccessor, allBindings, viewModel, bindingContext);
                var t = $(element).closest('table');
                d_table = t.DataTable(binding.options);      
                YADCF.init(d_table, [
                        {
                            column_number: 1,
                            filter_type: "multi_select",
                            select_type: 'chosen'
                        }
                    ]);                                                
                if (binding.options.paging) {
                    if (t.page.info().pages - ko.bindingHandlers.dataTablesForEach.page === 0) {
                        t.page(--ko.bindingHandlers.dataTablesForEach.page).draw(false);
                    } else {
                        t.page(ko.bindingHandlers.dataTablesForEach.page).draw(false);
                    }
                }

                if (!ko.utils.domData.get(element, key) && (binding.data || binding.length)) {
                    ko.utils.domData.set(element, key, true);
                }                                        

                return { controlsDescendantBindings: true };
            }
        };

使用带有Knockout的{YADCF数据表插件

0 个答案: