具有逗号的多重过滤的数据表

问题描述 投票:0回答:1

您好我正在使用此数据表here

现在,过滤器搜索Minimum d1和Maximum d1值正常工作,但问题是它无法使用逗号处理正确的值,这是此函数所必需的。

示例:我希望过滤器显示1.5到2.5之间的结果,截至目前它将显示介于1.00和2.99之间的任何数字,这是错误的。

可能是什么导致了这个?我在这里错过了正则表达式吗?

另外:可以将值从“,”更改为“。”意味着1,5或1.5在数据中没有问题,如果这对任何事都有帮助的话。

代码:

HTML:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
<link rel="stylesheet" type="text/css" href="data\jquery.dataTables.min.css">
<script type="text/javascript" language="javascript" src="data\jquery-1.12.4.js"></script>
<script type="text/javascript" charset="utf8" src="data\jquery.dataTables.min.js"></script>
<script src="data\custom.js" charset="utf-8"></script>
</head>

<body>
  <table border="0" cellspacing="5" cellpadding="5">
        <tbody><tr>
            <td>Minimum d1</td>
            <td><input type="text" id="min" name="min"></td>
        </tr>
        <tr>
            <td>Maximum d1</td>
            <td><input type="text" id="max" name="max"></td>
        </tr>
    </tbody>


</table>
  <table id="example" class="display" cellspacing="0" width="100%">

          <thead>
              <tr>
                  <th>M/Ø</th>
                  <th>Ww</th>
                  <th>Norm</th>
                  <th>d<sub>1</sub></th>
                  <th>d<sub>2</sub></th>
                  <th>h</th>

              </tr>
          </thead>
<tfoot></tfoot>
      </table>
</body>


</html>

JS

/* Custom filtering function which will search data in column four between two values */
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {

    var min = parseInt( $('#min').val(), 10 );
    console.log(min);
    var max = parseInt( $('#max').val(), 10 );


    var age = parseFloat( data[3] ) || 0; // use data for the age column

    if ( ( isNaN( min ) && isNaN( max ) ) ||
         ( isNaN( min ) && age <= max ) ||
         ( min <= age   && isNaN( max ) ) ||
         ( min <= age   && age <= max ) )
    {
        return true;
    }
    return false;
}
);

$(document).ready(function() {
var table = $('#example').DataTable( {
    "ajax": "data.txt"
} );

// Event listener to the two range filtering inputs to redraw on input
$('#min, #max').keyup( function() {
    table.draw();
} );
} );

Data.txt(虚拟数据)

{
  "data": [
    [
      "1",
      "",
      "ISO 7089 + 7090 (DIN 125-1 Pk A)",
      "1,1",
      "3",
      "0,3"
    ],

    [
    "1",
    "",
    "ISO 7092 (DIN 433 Pk A)",
    "1,1",
    "2,5",
    "0,3"
    ],

    [
    "1",
    "",
    "ISO 7092 (DIN 433 Pk A)",
    "2,6",
    "2,5",
    "0,3"
    ],

    [
    "1",
    "",
    "ISO 7092 (DIN 433 Pk A)",
    "1,1",
    "2,5",
    "0,3"
    ],



    [
    "1",
    "",
    "ISO 7092 (DIN 433 Pk A)",
    "1,4",
    "2,5",
    "0,3"
    ]



  ]
}
javascript jquery datatables
1个回答
1
投票

现在,您的最小值和最大值是使用parseInt定义的,因此您可以获得整数,而您需要浮点数。

我认为你应该更换

var min = parseInt( $('#min').val(), 10 );
var max = parseInt( $('#max').val(), 10 );

var min = parseFloat($('#min').val().replace(',', '.'));
var max = parseFloat($('#max').val().replace(',', '.'));

另外,请注意替换部分,因为parseFloat不会将coma作为小数分隔符处理,因此您的年龄数据将无法正确解析。您还需要执行以下操作:

var age = parseFloat(data[3].replace(',', '.')) || 0;
© www.soinside.com 2019 - 2024. All rights reserved.