php - JQuery Ajax - 订单在 1 个字段上工作
问题描述
我是 jquery/ajax 的新手,正在处理一个简单的 Ajax/Jquery html 表 - MySql。除了“点击订购”字段外,一切正常。单击列标题(期望在此字段上排序)后,它会在前一列/字段上排序。我做了一些调整,但还是一样。原始代码来自 phpzag.com。
<?php
include('inc/header.php');
?>
<title>phpzag.com : Demo Live Add Edit Delete datatables Records with Ajax, PHP and MySQL</title>
<?php //include('inc/container.php');
$Col0 = "id";
$Col1 = "Topic";
$Col2 = "FileName";
$Col3 = "Size";
$Col4 = "Created";
$Col5 = "Modified";
$Col6 = "Folder";
?>
<div class="container contact">
<h2>Example: Live Add Edit Delete datatables Records with Ajax, PHP and MySQL</h2>
<div class="col-lg-10 col-md-10 col-sm-9 col-xs-12">
<div class="panel-heading">
<div class="row">
<div class="col-md-10">
<h3 class="panel-title"></h3>
</div>
<div class="col-md-2" align="right">
<!--- <button type="button" name="add" id="addRecord" class="btn btn-success">Add New Record</button> <!-- Original--->
<button type="button" name="add" id="addRtf" class="btn btn-success">Add New WordPad</button> <!--- Manoj --->
</div>
</div>
</div>
<table id="recordListing" class="table table-bordered table-striped"> <!-- ManojComment View page + update/close button --->
<thead>
<tr>
<!---<th>#</th> --->
<!---<th><?php //echo $Col0; ?></th> --->
<th><?php echo $Col1; ?></th>
<th><?php echo $Col2; ?></th>
<th><?php echo $Col3; ?></th>
<th><?php echo $Col4; ?></th>
<th><?php echo $Col5; ?></th>
<th><?php echo $Col6; ?></th>
<th>#</th>
<!--- <th></th> //Manoj removed - avoid del/update buttona
<th></th> -->
<th></th>
</tr>
</thead>
</table>
</div>
<div id="recordModal" class="modal fade">
<div class="modal-dialog">
<form method="post" id="recordForm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title"><i class="fa fa-plus"></i> Edit Record</h4>
</div>
<div class="modal-body"> <!--- ManojComment EDIT modal page --->
<div class="form-group">
<label for="<?php echo $Col0; ?>" class="control-label"><?php echo $Col0; ?></label>
<input type="text" class="form-control" id="<?php echo $Col0; ?>" name="<?php echo $Col0; ?>" placeholder="<?php echo $Col0; ?>" required>
</div>
<div class="form-group">
<label for="<?php echo $Col1; ?>" class="control-label"><?php echo $Col1; ?></label>
<input type="text" class="form-control" id="<?php echo $Col1; ?>" name="<?php echo $Col1; ?>" placeholder="<?php echo $Col1; ?>" required>
</div>
<div class="form-group">
<label for="<?php echo $Col2; ?>" class="control-label"><?php echo $Col2; ?></label>
<input type="number" class="form-control" id="<?php echo $Col2; ?>" name="<?php echo $Col2; ?>" placeholder="<?php echo $Col2; ?>">
</div>
<div class="form-group">
<label for="<?php echo $Col3; ?>" class="control-label"><?php echo $Col3; ?></label>
<input type="text" class="form-control" id="<?php echo $Col3; ?>" name="<?php echo $Col3; ?>" placeholder="<?php echo $Col3; ?>" required>
</div>
<div class="form-group">
<label for="<?php echo $Col4; ?>" class="control-label"><?php echo $Col4; ?></label>
<textarea class="form-control" rows="5" id="<?php echo $Col4; ?>" name="<?php echo $Col4; ?>"></textarea>
</div>
<div class="form-group">
<label for="<?php echo $Col5; ?>" class="control-label"><?php echo $Col5; ?></label>
<input type="text" class="form-control" id="<?php echo $Col5; ?>" name="<?php echo $Col5; ?>" placeholder="<?php echo $Col5; ?>">
</div>
<div class="form-group">
<label for="<?php echo $Col6; ?>" class="control-label"><?php echo $Col6; ?></label>
<input type="text" class="form-control" id="<?php echo $Col6; ?>" name="<?php echo $Col6; ?>" placeholder="<?php echo $Col6; ?>">
</div>
</div>
<div class="modal-footer">
<input type="hidden" name="id" id="id" />
<input type="hidden" name="action" id="action" value="" />
<input type="submit" name="save" id="save" class="btn btn-info" value="Save" />
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</form>
</div>
</div>
</div>
<?php include('inc/footer.php');?>
ajax_action.php
<?php
include_once 'config/Database.php';
include_once 'class/Records.php';
$database = new Database();
$db = $database->getConnection();
$record = new Records($db);
if(!empty($_POST['action']) && $_POST['action'] == 'listRecords') {
$record->listRecords();
}?>
数据库.php
<?php
class Database{
private $host = 'localhost';
private $user = 'root';
private $password = "dd";
private $database = "dd";
public function getConnection(){
$conn = new mysqli($this->host, $this->user, $this->password, $this->database);
if($conn->connect_error){
die("Error failed to connect to MySQL: " . $conn->connect_error);
} else {
return $conn;
}
}
}
Ajax.js
$(document).ready(function(){
var dataRecords = $('#recordListing').DataTable({
"lengthChange": false,
"processing":true,
"serverSide":true,
'processing': true,
'serverSide': true,
'serverMethod': 'post',
"order":[],
"ajax":{
url:"ajax_action.php",
type:"POST",
data:{action:'listRecords'},
dataType:"json"
},
/*"columnDefs":[
{
"targets":[0, 6, 7],
"orderable":false,
},
],*/
"pageLength": 100
});
记录.php
class Records {
private $recordsTable = 'files';
public $id;
public $Topic;
public $FileName;
public $Size;
public $Created;
public $Modified;
public $Folder;
private $conn;
public function __construct($db){
$this->conn = $db;
}
public function listRecords(){
$Col0 = "id";
$Col1 = "Topic";
$Col2 = "FileName";
$Col3 = "Size";
$Col4 = "Created";
$Col5 = "Modified";
$Col6 = "Folder";
$sqlQuery = "SELECT * FROM ".$this->recordsTable." ";
if(!empty($_POST["search"]["value"])){
$sqlQuery .= 'where('.$Col0.' LIKE "%'.$_POST["search"]["value"].'%" ';
$sqlQuery .= ' OR '.$Col1 .' LIKE "%'.$_POST["search"]["value"].'%" ';
$sqlQuery .= ' OR '.$Col2 .' LIKE "%'.$_POST["search"]["value"].'%" ';
$sqlQuery .= ' OR '.$Col3 .' LIKE "%'.$_POST["search"]["value"].'%" ';
$sqlQuery .= ' OR '.$Col4 .' LIKE "%'.$_POST["search"]["value"].'%" ';
$sqlQuery .= ' OR '.$Col5 .' LIKE "%'.$_POST["search"]["value"].'%" ';
$sqlQuery .= ' OR '.$Col6 .' LIKE "%'.$_POST["search"]["value"].'%") ';
}
if(!empty($_POST["order"])){
$sqlQuery .= 'ORDER BY '.$_POST['order']['0']['column'].' '.$_POST['order']['0']['dir'].' ';
} else {
$sqlQuery .= 'ORDER BY id DESC ';
}
if($_POST["length"] != -1){
$sqlQuery .= 'LIMIT ' . $_POST['start'] . ', ' . $_POST['length'];
}
$stmt = $this->conn->prepare($sqlQuery);
$stmt->execute();
$result = $stmt->get_result();
$stmtTotal = $this->conn->prepare("SELECT * FROM ".$this->recordsTable);
$stmtTotal->execute();
$allResult = $stmtTotal->get_result();
$allRecords = $allResult->num_rows;
$displayRecords = $result->num_rows;
$records = array();
while ($record = $result->fetch_assoc()) {
$rows = array();
//$rows[] = ucfirst($record[$Col1]);//original
$rows[] = $record[$Col1];//manoj as order not working properly, test
$rows[] = $record[$Col2];
$rows[] = $record[$Col3];
$rows[] = $record[$Col4];
$rows[] = $record[$Col5];
$rows[] = $record[$Col6];
$rows[] = $record[$Col0];
//$rows[] = '<button type="button" name="update" id="'.$record["id"].'" class="btn btn-warning btn-xs update">Update</button>'; //original
//$rows[] = '<button type="button" name="delete" id="'.$record["id"].'" class="btn btn-danger btn-xs delete" >Delete</button>'; //Original
$rows[] = '<button type="button" name="open" id="'.$record["id"].'" class="btn btn-warning btn-xs open" >Open</button>';
$records[] = $rows;
}
$output = array(
"draw" => intval($_POST["draw"]),
"iTotalRecords" => $displayRecords,
"iTotalDisplayRecords" => $allRecords,
"data" => $records
);
echo json_encode($output);
}
解决方案
推荐阅读
- c - `(i) = 1` 在标准 C 中是非法的吗?
- reactjs - ReactJS Call Function of another Component react-router
- python - I am trying to rename multiple files programmatically but when i run code it deletes all files from given folder
- ruby-on-rails - rails 任务和生成器失败
- angular - 使用 Jasmine 进行角度单元测试过滤谓词功能
- ios - Programmatically created UIViewController partially hidden by navigation bar
- css - Bootstrap layout - responsive rows and columns order
- c# - Problem with drag-and-drop WPF. Dragging button as ListBoxItem leaves blank field
- json - 将 XML 文件转换为 JSON
- ssh - 在 VMvare Workstation 中运行 Mininet 的 SSH 权限被拒绝