使用自定义过滤器按钮过滤列表,仅在第一次单击时有效,但随后的点击效果不佳!特效

汤姆

我有2个SP列表(A和B)。列表A在每个列表项旁边都有过滤器按钮。当用户单击按钮时,它应该过滤列表B,仅显示相关项目。

列表A具有列表B匹配的ID列它的列(MasterItems)与列表A的ID。

这是我正在使用的代码:

public _getListItems() {
    sp.web.lists.getByTitle("ListA").items.get().then((items: any[]) => {
      let returnedItems: IListAItem[] = items.map((item) => { return new ListAItem(item); });

      this.setState({ 
        Items: returnedItems,
        ListAItems: returnedItems,

      });
    });
    sp.web.lists.getByTitle("ListB").items.get().then((items: any[]) => { 
      let returnedItems: IListBItem[] = items.map((item) => { return new ListBItem(item); });

      this.setState({ 

        ListBItems: returnedItems, //This brings in the items from ListB so they can be filtered on this.state.ListB when clicked
      });
    }); 
  }
  private _editItem = (ev: React.MouseEvent<HTMLElement>) => {
   this._getListItems(); //This attempts to reset the list when another filter is clicked, but is half working!
    const sid = Number(ev.currentTarget.id);
    const sid2 = 'DIBR'+sid;
    let _item = this.state.ListBItems.filter((item) => { return item.MasterItem == sid2; });

    if (_item && _item.length > 0) {

      sp.web.lists.getByTitle("ListB").items.get().then((items: any[]) => {
        let returnedItems: IListBItem[] = 
            items.filter(i => _item.some(other => other.Id === i.Id)).map(
              (item) => new ListBItem(item)
              );

        this.setState({ 
          ListBItems: returnedItems,
         });
      });
     } 
  }  

问题是,当单击某个项目旁边的按钮时,第一次单击时它会正确过滤!但是如果在相同或不同的项目上再次进行过滤,则有时会取消设置过滤器并混合结果,而有时会正确过滤。因此,我怀疑自己在这里遇到了州问题,但似乎找不到原因。

问候,

Ť

更新:我添加了一个清除过滤器按钮,该按钮可以使事情正常运行,但是希望用户能够单击过滤器进行过滤,而不必每次都将其清除。

我在SharePoint列表中也做同样的事情,所以基本上我总是在过滤器功能之前设置清除过滤器功能,例如:

function myFilter(){
//my filter code goes here
}

function clearFilter(){
//the clear filter code goes here
}

假设您要在项目选择,按钮单击或文本输入更改上运行该功能,请将清除过滤器设置为在过滤器之前运行。

function funcGroup{
clearFilter();

setTimeout(() => {
    myFilter();  
}, 300);

}

要么

function funcGroup{
setTimeout(() => {
clearFilter();
}, 300);

    myFilter();  
}

我将这种情况与我的SharePoint列表结合使用,并且可以完美地工作...

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Xaml C#绑定数据仅在第一次有效

来自分类Dev

我的剑道级联下拉列表失败了。仅在第一次使用时有效

来自分类Dev

jQuery | 点击操作仅在第一次有效

来自分类Dev

jQuery Mobile listview详细信息页面数据跟踪仅在第一次时有效

来自分类Dev

没有自定义过滤器的ListView过滤

来自分类Dev

twitter小部件仅在第一次加载时有效,然后失败

来自分类Dev

分页不适用于带有过滤器的Primefaces dataTable(仅限第一次)

来自分类Dev

Javascript:JSON请求仅在第一次使用时有效

来自分类Dev

重新加载页面后,Gif无法正常工作。仅在第一次打开窗口时有效

来自分类Dev

调用使用观察功能在选择框中显示子类别列表的功能仅在第一次时有效

来自分类Dev

正常运行时,第一次点击chrome.runtime.sendMessage无效。它虽然在调试时有效

来自分类Dev

jQuery仅在第一次时有效,但在第二次在ng-repeat中循环时无效

来自分类Dev

jQuery验证-errorPlacement仅在第一次使用时有效

来自分类Dev

从mysql获取的jQuery仅在第一次有效

来自分类Dev

Grep过滤器不会在第一次比赛时停止

来自分类Dev

Intent Intents.Insert.ACTION仅在第一次使用时有效?

来自分类Dev

文档生成仅在第一次时有效

来自分类Dev

jQuery Mobile listview详细信息页面数据跟踪仅在第一次时有效

来自分类Dev

具有`getopts`的Bash函数仅在第一次运行时有效

来自分类Dev

“ TemplateSyntaxError:无效的过滤器:”; 基于django文档的自定义django模板过滤器已损坏,但模板标签有效

来自分类Dev

Office 365应用和Angular 2路由仅在第一次使用时有效

来自分类Dev

Javascript:JSON请求仅在第一次使用时有效

来自分类Dev

对象搜索仅在第一次时有效

来自分类Dev

存储过程中的临时视图仅在第一次更新时有效

来自分类Dev

切换仅在第一次时有效

来自分类Dev

Angularjs 过滤器页面第一次加载

来自分类Dev

验证第一次有效,但随后无效

来自分类Dev

getElementById 仅在第一次有效

来自分类Dev

为什么按 Id 对对象列表进行分组仅在第一次调用该函数时有效?

Related 相关文章

  1. 1

    Xaml C#绑定数据仅在第一次有效

  2. 2

    我的剑道级联下拉列表失败了。仅在第一次使用时有效

  3. 3

    jQuery | 点击操作仅在第一次有效

  4. 4

    jQuery Mobile listview详细信息页面数据跟踪仅在第一次时有效

  5. 5

    没有自定义过滤器的ListView过滤

  6. 6

    twitter小部件仅在第一次加载时有效,然后失败

  7. 7

    分页不适用于带有过滤器的Primefaces dataTable(仅限第一次)

  8. 8

    Javascript:JSON请求仅在第一次使用时有效

  9. 9

    重新加载页面后,Gif无法正常工作。仅在第一次打开窗口时有效

  10. 10

    调用使用观察功能在选择框中显示子类别列表的功能仅在第一次时有效

  11. 11

    正常运行时,第一次点击chrome.runtime.sendMessage无效。它虽然在调试时有效

  12. 12

    jQuery仅在第一次时有效,但在第二次在ng-repeat中循环时无效

  13. 13

    jQuery验证-errorPlacement仅在第一次使用时有效

  14. 14

    从mysql获取的jQuery仅在第一次有效

  15. 15

    Grep过滤器不会在第一次比赛时停止

  16. 16

    Intent Intents.Insert.ACTION仅在第一次使用时有效?

  17. 17

    文档生成仅在第一次时有效

  18. 18

    jQuery Mobile listview详细信息页面数据跟踪仅在第一次时有效

  19. 19

    具有`getopts`的Bash函数仅在第一次运行时有效

  20. 20

    “ TemplateSyntaxError:无效的过滤器:”; 基于django文档的自定义django模板过滤器已损坏,但模板标签有效

  21. 21

    Office 365应用和Angular 2路由仅在第一次使用时有效

  22. 22

    Javascript:JSON请求仅在第一次使用时有效

  23. 23

    对象搜索仅在第一次时有效

  24. 24

    存储过程中的临时视图仅在第一次更新时有效

  25. 25

    切换仅在第一次时有效

  26. 26

    Angularjs 过滤器页面第一次加载

  27. 27

    验证第一次有效,但随后无效

  28. 28

    getElementById 仅在第一次有效

  29. 29

    为什么按 Id 对对象列表进行分组仅在第一次调用该函数时有效?

热门标签

归档