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複選框值

回答

相關問題