jquery datatables复选框值

我正在使用IgnitedDatatables包装器以表格形式呈现数据。从示例中，我设法使用jquery ui中的滑块进行范围过滤，但是我想根据复选框值进行过滤，但我没有任何想法将复选框值传递给ajax处理页面。jquery datatables复选框值

下面是使用滑块的范围过滤器代码：

ajax.php：

`<?php` 
`require_once('Datatables.php');` 
$datatables = new Datatables('mysqli'); 

// MYSQL configuration 
$config = array(
'username' => 'root', 
'password' => 'xxxxx', 
'database' => 'mydb', 
'hostname' => 'localhost'); 

$datatables->connect($config); 

$datatables 

->select('column1,column2,column3,column4') 
->from('mytable'); 

if(isset($_POST['min_length']) && $_POST['min_length'] != '') 
$datatables->where('column1 >=', $_POST['min_length']); 

if(isset($_POST['max_length']) && $_POST['max_length'] != '') 
$datatables->where('column1 <=', $_POST['max_length']); 

echo $datatables->generate(); 
?>

example.html的：

<script type="text/javascript" charset="utf-8"> 
$(document).ready(function() 
{ 
var oTable = $('#example').dataTable 
({ 
"oLanguage" :{ "sSearch" : "Search Global:" 
}, 
    'bServerSide' : true, 
    'sAjaxSource' : 'ajax.php', 
    "bJQueryUI": true, 
    "sPaginationType": "full_numbers", 
    'fnServerData': function(sSource, aoData, fnCallback) 
    { 
     aoData.push({ "name": "min_length", "value": $("#min_length").val() }, 
        { "name": "max_length", "value": $("#max_length").val() }, 
    ); 
     $.ajax 
     ({ 
      'dataType': 'json', 
      'type' : 'POST', 
      'url'  : sSource, 
      'data' : aoData, 
      'success' : fnCallback 
     }); 
    }, 
}); 

//Slider Range for pVal 
$("#slider-range").slider({ 
    step: 0.1, 
    range: true, 
    min: -8, 
    max: 8, 
    values: [ -8, 8 ], 
    slide: function(event, ui) { 
    $("#min_length").val(ui.values[ 0 ]); 
    $("#max_length").val(ui.values[ 1 ]); 
    }, 
    stop: function(event, ui) { 
     oTable.fnDraw(); 
    } 
}); 
$("#min_length").val($("#slider-range").slider("values", 0)); 
$("#max_length").val($("#slider-range").slider("values", 1)); 

</script> 
<body id="dt_example"> 
</head> 
<div id="container"> 
<h1>RRL DGE DB - Advanced Browsing</h1> 

<table width="200" border="0" cellspacing="0" cellpadding="0" id="slider"> 
<div class="demo1"> 
<div class="demo" style='width:250px;'> 
<p> 
<tr> 
<td><label for="amount">Min:</label><input type="text" id="min_length" style="border:0; color:#f6931f; font-weight:bold" disabled=disabled/><br></td> 

<td><label for="amount">Max:</label><input type="text" id="max_length" style="border:0; color:#f6931f; font-weight:bold;" disabled=disabled/></td> 
<td>&nbsp&nbsp&nbsp</td> 
<td width="200">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<div id="slider-range"></div></td> 
</div> 
</tr> 
</p> 

</div><!-- End demo --> 
</table> 

<BR> 
<table border="0" cellpadding="4" cellspacing="0" class="display" id="example"> 
<thead> 
    <tr> 
    <th width="10%">column1</th> 
    <th width="55%">column2</th> 
    <th width="10%">column3</th> 
    <th width="10%">column4</th> 
    <th width="15%">column5</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
    <td>loading...</td> 
    </tr> 
</tbody> 

</table> 


</div> 


</body> 
</html>

问题是我该怎么办了相同的范围过滤使用复选框，而不是滑块？我需要的是将0或1的值发送到ajax.php，以便允许用户选择具有0或多于1个结果的列。我是非常新的PHP/jQuery UI。任何帮助，高度赞赏。

谢谢！

来源

2012-02-07 joomanji

你能尝试添加一个复选框id为mycheckbox并在fnServerData添加附加参数 - 这样的事情：

'fnServerData': function(sSource, aoData, fnCallback) 
    { 
    aoData.push({ "name": "min_length", "value": $("#min_length").val() }, 
        { "name": "max_length", "value": $("#max_length").val() }, 
        { "name": "USEALL", "value": $("#mycheckbox").val() }, 
);

我认为PHP的页面上，你将能够读取新的参数USEALL与复选框的值。

Jovan

来源

2012-02-14 21:16:29

jquery datatables复选框值

回答

相关问题