【问题标题】:do tags into clickable tags filters for jquery table - yadcf将标签添加到 jquery 表的可点击标签过滤器中 - yadcf
【发布时间】:2015-03-12 09:25:42
【问题描述】:

我看到了这个用于数据表的过滤 yadcf 演示:Live Demo
您可以按标签过滤表格,但不能单击Tag1Tag2 来像过滤表格结果一样使用它们,并且只返回具有Tag1Tag2 的行。 是否可以像可点击标签过滤器模式一样在表格内使用标签?

哪些代码必须在jquery.datatables.yadcf.js 中编辑/添加?

在上面的演示中,这是代码的一部分。如何在column_number: 4或标签栏实现我的功能请求?

    $(document).ready(function () {
    'use strict';

    //----------------------------------------------
    // this is the code for column tag
    //----------------------------------------------

    oTable = $('#example').dataTable({
        "bJQueryUI": true,
        "bStateSave": true
    }).yadcf([{

     ......
     ......

       {
        column_number: 4,
        select_type: 'select2',
        select_type_options: {
            width: '150px'
            placeholder: 'Select tag',
            allowClear: true  // show 'x' (remove) next to selection inside the select itself
        },
        column_data_type: "html",
        html_data_type: "text",
        filter_reset_button_text: false // hide yadcf reset button
    }]);

    SyntaxHighlighter.all();

哪些参数必须编辑?

column_number
filter_type
custom_func
data
column_data_type
text_data_delimiter
html_data_type
filter_container_id
filter_default_label
filter_reset_button_text
enable_auto_complete
sort_as
sort_order
date_format
ignore_char
filter_match_mode
select_type
select_type_options
case_insensitive
filter_delay

【问题讨论】:

  • 您的意思是您希望能够单击表格行本身内部的标签,而不是标题中的下拉菜单?
  • 是的,就是这样,在表格行内。

标签: javascript jquery datatable yadcf


【解决方案1】:

可以通过以下方式实现

1) 在页面准备好时调用此代码(请注意,您的选择器可能会有所不同)

$('#example').on('click',".label.lightblue", function () {
  yadcf.exFilterColumn(oTable, [[4, $(this).text()]]);
});

2) 将 onclick 事件附加到您的“标签”,类似于 onclick="yadcf.exFilterColumn(oTable, [[4, 'Tag1']]);"

【讨论】:

  • 我尝试整合,但出了点问题。请检查我的代码好吗? pastebin.com/PzdC0vBf 如果我的代码集成错误,您能否在 pastebin 或 JSFiddle 上正确重新粘贴?
  • @user3520363 ,您需要将$(".label.lightblue" ).on( "click", function() {.... 代码放在$('#example').dataTable().yadcf([... 代码之后(在$(document).ready(function(){... 代码块内
  • 谢谢丹尼尔。我非常喜欢标签过滤器,因为如果你想explore 并且不要每次都在许多音乐流派、演员姓名、电影等中输入值,它会非常有用。你应该在未来为 yadcf 添加这个功能。
猜你喜欢
  • 2017-05-14
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多