为什么展开和折叠不起作用,在Accordion列表中搜索文本后

Why Expand and collapse is not working, After text search in Accordion List?

本文关键字:列表 Accordion 搜索 文本 折叠 不起作用 为什么      更新时间:2023-09-26

我已经通过使用这些演示实现了AccordionList 1)https://github.com/kawanoshinobu/Ext.ux.AccordionList2)http://docs.kawanoshinobu.com/accordionlist/。手风琴列表显示得很好。根据需要在手风琴列表上实时搜索文本我只需要在手风琴式列表标题中搜索文本,而不需要在子节点中搜索。经过搜索,一旦得到手风琴式标题应该能够展开和折叠这些标题我已尝试使用此链接http://docs.sencha.com/touch/2.2.1/#/示例/搜索列表。对于我已经应用到AccordionList的列表来说,它运行得非常好。它正在从显示可用标题的标题中搜索,但我无法展开标题,但它包含子节点(通过console.log(abc)看到子节点)。点击展开和折叠,正确执行代码,没有任何错误/问题。为了获得更多参考,我在下面提供了代码。有谁能告诉我如何在手风琴列表中实现这一点吗?非常感谢。非常感谢。

代码在这里:

 if(searchfield !== ""){
     store.filter([{
     property: "text",
     value: searchfield,
     anyMatch: true
     //exactMatch:true
    }]);
}
else{
    store.clearFilter();
}

将此存储值分配给手风琴列表代码低于

var accordionlistContent = {
                                xtype: 'accordionlist',
                                //store: Ext.create('eGMonitorApp.store.TestsStore'),
                                store: store,
                                name: 'accordionList',
                                height: 500,
                                headerItemTpl: [
                                    '<tpl if="this.isExpanded(values)">',
                                    '<div class="testsstatus{status}"></div></div>',
                                    '<div style="width:80%;margin-left: 10px" <tpl if="values.year">style="font-style:italic; "</tpl>>',
                                    '{text}</div>',
                                    '<div class="down"></div>',
                                    '<tpl else>',
                                    '<div class="testsstatus{status}"></div></div>',
                                    '<div style="width:80%;margin-left: 10px"<tpl if="values.year">style="font-style:italic;"</tpl>>',
                                    '{text}</div>',
                                    '<div class="right"></div>',
                                    '</tpl>'
                                ].join(''),
                                contentItemTpl: [
                                    '<div class="testsstatus{status}"></div></div>',
                                    '<div style="margin-left: 10px" >{text}<div>'
                                ].join(''),
                                useSelectedHighlights: false,
                                indent: true
                            }

展开/折叠代码:

doAllExpand: function() {       
        var me = this;
        me.doAll(function expand(node) {
            if (me.getAnimation()) {
                me.addListExpandListeners(node);
            }
            node.expand();
            if (!node.isLeaf()) {
                node.childNodes.forEach(expand, me);
            }
        });
    },
doAllCollapse: function() {
        var me = this;
        me.doAll(function collapse(node) {
            node.collapse();
            if (!node.isLeaf()) {
                node.childNodes.forEach(collapse, me);
            }
        });
    },

我已经成功了。store.filter函数,很好地过滤文本,但如果它有子节点,它也不会显示。因为我们在商店里搜索了一些特定的文本。after过滤器只显示那些过滤器文本。我走了另一条路。按照我的要求,它运行得很好。我正在调用web服务store.load()。在商店中搜索输入的文本。如果输入的文本在父级不可用,则从存储中删除该特定项目。迭代后,最终存储分配给手风琴列表手风琴式列表显示相关的搜索文本数据。欢呼:)。下面是代码。非常感谢。

store.getProxy().setUrl('resources/Json/TestsStore.json');           
            store.load({
                scope: this,
                callback: function(records, operation, success) {
                    if (success) {
                            if(searchfield !=="") {                                
                                if(store.data.items.length !==0){
                                    var length = store.data.items.length;
                                    for(var j=length; j--;) {
                                    if(store.data.items[j].data.name.search(new RegExp(searchfield, "i")) ===-1){
                                        store.data.items[j].remove();
                                    }
                                }
                              }
                            }
                        if(store.data.items.length ===0){
                            eGMonitorApp.util.Utility.showAlert('Searched text not available.','Tests');
                        }                       
                        this.getAccordionListRef().setStore(store);
                    }
                }
            });