如何让 jQuery DataTables 对隐藏值进行排序，但搜索显示值? [英] How can I get jQuery DataTables to sort on hidden value, but search on displayed value?

问题描述

我有一个简单的 DataTables 网格，其中包含日期列.我在我的 JSON 数据集中为日期提供了两个值，一个用于显示，一个专门设计以便 DataTables 可以对其进行排序.我的网络应用程序允许用户选择一堆不同的日期格式，所以它需要灵活.

I have a simple DataTables grid which contains date columns. I have provided two values for the date in my JSON data set, one for display and one specifically designed so that DataTables can sort it. My web application allows users to choose a bunch of different date formats, so it needs to be flexible.

这是 DataTables 通过 sAjaxSource 从 Web 服务器获取的我的 JSON 数据.

This is my JSON data that DataTables gets from from the web server via sAjaxSource.

{
  Reports : [
    { Date: { Sort = "20101131133000", Display : "11/31/2010 1:30 PM" } }, 
    { Date: { Sort = "20100912120000", Display : "1200 EST 2010-09-12" } }, 
  ]
}

很容易告诉 DataTables 根据 Date.SortValue 属性进行排序，并使用 fnRender() 使 Display 属性对用户可见.所以这让我的目标实现了一半.

It is easy to tell DataTables to sort based on the Date.SortValue property and to make the Display property visible to the user by using fnRender(). So this gets me halfway to my goal.

var dataTableConfig = {
  sAjaxSource: "/getreports",
  sAjaxDataProp: "Reports",
  aoColumns: [
    { mDataProp: "User" },
    { mDataProp: "Date.Sort", 
      bSortable: true, 
      sName: "Date", 
      bUseRendered: false, 
      fnRender: function (oObj) {
        return oObj.aData[oObj.oSettings.aoColumns[oObj.iDataColumn].sName].Display;
      }
    }
  ]
};

这是我的问题.我想让用户根据显示的值输入一个过滤器(使用 DataTables 提供的内置过滤器输入)，但是他们不能.

Here's my problem. I want to allow the user to enter a filter (using the built-in filter input that DataTables provides) based on the displayed value, but they cannot.

例如.如果用户输入EST"，他们将得到零结果，因为数据表过滤器基于 mDataProp 中指定的值而不是基于从 fnRender 返回的值.

For example. If a user entered "EST", they would get zero results because datatables filters based on the value specified in mDataProp not based on the value returned from fnRender.

谁能帮我弄清楚如何对日期列进行排序和过滤?谢谢.

Can anyone help me figure out how to sort AND filter a date column? Thanks.

推荐答案

这是一个老帖子，但希望这能帮助到这里的其他人.

This is an old post, but hopefully this will help someone else that comes here.

在较新版本的 DataTables 中，bUseRendered 和 fnRender 已弃用.

In a more recent version of DataTables, bUseRendered and fnRender are deprecated.

mRender 是做这种事情的新方法，并且有一个方法略有不同.

mRender is the new way of doing this sort of thing and has a slightly different approach.

您可以通过以下方式解决您的问题:

You can solve your issue with something along the lines of:

...
{ mDataProp: "Date.Sort"
  bSortable: true, 
  sName: "Date", 
  // this will return the Display value for everything
  // except for when it's used for sorting,
  // which then it will use the Sort value
  mRender: function (data, type, full) {
    if(type == 'sort') return data.Sort;
    return data.Display
  }
}
...

这篇关于如何让 jQuery DataTables 对隐藏值进行排序，但搜索显示值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！