У меня есть база данных MySQL, которая содержит данные о клиентах, которые мои пользователи хотели бы просматривать и сортировать.Я подумал, что самый простой способ сделать это - бросить данные в таблицу и попытаться сделать данные красивыми.Я решил использовать bootgrid.Я использовал исходный код отсюда - https://www.phpflow.com/php/addedit-delete-record-using-bootgrid-php-mysql. Он отображает записи на основе критериев в вашем запросе и имеет кнопки, позволяющие добавлять, редактировать или удалять записи.
Я смогнастроить и отобразить нужную мне информацию.Поскольку большинство пользователей интересуются только последними записями клиента и только несколькими полями из указанных записей, SQL-запрос извлекает только самые последние записи, основанные на отметке времени.Таким образом, вместо того, чтобы извлекать каждую запись для каждого клиента, он просто извлекает последнюю запись.Причиной, по которой я пошел с этим конкретным форматом загрузочной сетки, были, честно говоря, кнопки.Я хочу использовать одну из кнопок для отображения ВСЕХ записей для выбранного клиента.
На данный момент, когда пользователь просматривает таблицу загрузочной сетки, имена клиентов отображаются вместе с данными из 5 дополнительных полей.Если пользователь хочет просмотреть все отправленные записи для определенного клиента (и все поля), я бы хотел, чтобы он щелкнул по кнопке в той же строке, что и клиент, и во всплывающем окне появятся все записи для этого клиента.Бит информации - кнопка редактирования из вышеприведенной демонстрации открывает другое окно, предварительно заполняет указанные поля и позволяет редактировать и затем сохранять в вашей базе данных.
Поскольку кнопки уже были в конце строк, я вынул код для кнопки редактирования и заменил его кодом для другой таблицы загрузочной сетки.Если мой запрос для этой второй таблицы установлен на что-то вроде "$sql = "SELECT * FROM `MyTable` ";", все данные в таблице возвращаются во втором окне.Это говорит мне, что таблица и запрос (по крайней мере для *) работают.Теперь мне нужно отобразить только данные для конкретного клиента.
И это проблема.Я не могу понять, как отформатировать второй запрос или найти / передать соответствующую переменную, чтобы просмотреть только тот клиент, на который я нажал.
Таким образом, чтобы немного подвести итог, когда я нажимаю кнопку редактирования, запускается 2-й запрос, который использует измененную копию response.php (responseuser.php - самый простой способ, который я нашел, чтобы хранить запросы отдельно) иесли я воспользуюсь приведенным ниже, моя вторая таблица загрузочной таблицы заполняется -
$sql = "SELECT * FROM `MyTable` ";
или
$sql = "SELECT tt.* FROM MyTable tt INNER JOIN (SELECT client_Name, MAX(timestamp) AS MaxDateTime FROM MyTable GROUP BY client_Name) groupedtt ON tt.client_Name = groupedtt.client_Name AND tt.timestamp = groupedtt.MaxDateTime";
или
$sql = "SELECT * FROM `MyTable` WHERE client_Name = 'client_Name_here'";
Что бы я хотел получитьэто что-то вроде -
$sql = "SELECT * FROM `MyTable` WHERE client_Name = Variable for client_Name";
Если я добавлю в запрос неверный код (ненужные кавычки или скобки), ответ всегда будет - «Результаты не найдены!».
Если я поставлюв том, что я думаю, что переменная должна быть, ответ "Загрузка ..."
Так это просто, как я не использую правильную переменную или что она ничего не передает?
Раньше я никогда не использовал Ajax или загрузочную таблицу, поэтому я не уверен, возможно ли то, что я пытаюсь сделать.Если нет, я всегда могу выбрать другой маршрут.
PHP-файл, отображающий таблицы -
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Results</title>
<link rel="stylesheet" href="dist/bootstrap.min.css" type="text/css" media="all">
<link href="dist/jquery.bootgrid.css" rel="stylesheet" />
<script src="dist/jquery-1.11.1.min.js"></script>
<script src="dist/bootstrap.min.js"></script>
<script src="dist/jquery.bootgrid.min.js"></script>
</head>
<body>
<div class="container">
<div class="">
<h1>Results</h1>
<div class="col-sm-6">
<!-- <div class="well clearfix">-->
<div class="table-responsive">
<!-- <div class="pull-right"><button type="button" class="btn btn-xs btn-primary" id="command-add" data-row-id="0">
<span class="glyphicon glyphicon-plus"></span> Record</button></div></div>-->
<table id="employee_grid" class="table table-responsive table-hover table-striped" cellspacing="0" style="width: auto;" data-toggle="bootgrid">
<thead>
<tr>
<th class="span2" data-column-id="id" data-type="numeric" data-identifier="true">ID</th>
<th data-column-id="client_Name">Client Name</th>
<th data-column-id="date">Date</th>
<th data-column-id="total">Total</th>
<th data-column-id="client_Contact">Contact</th>
<th data-column-id="client_Country" >Country</th>
<th data-column-id="commands" data-formatter="commands" data-sortable="false">Commands</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
<div id="edit_model" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<h1>Full Results</h1>
<?php echo $sql; ?>
<div class="col-sm-12">
<div class="container">
</div></div>
<table id="employee_grid1" class="table table-responsive table-hover table-striped" cellspacing="0">
<thead>
<tr>
<th class="span2" data-column-id="id" data-type="numeric" data-identifier="true">ID</th>
<th data-column-id="client_Name">Client Name</th>
<th data-column-id="date">Date</th>
<th data-column-id="total">Total</th>
<th data-column-id="client_Contact">Contact</th>
<th data-column-id="client_Country" >Country</th>
<th data-column-id="client_Name">Client Name</th>
<th data-column-id="date">Date</th>
<th data-column-id="total">Total</th>
<th data-column-id="client_Contact">Contact</th>
<th data-column-id="client_Country" >Country</th>
<th data-column-id="client_Name">Client Name</th>
<th data-column-id="date">Date</th>
<th data-column-id="total">Total</th>
<th data-column-id="client_Contact">Contact</th>
<th data-column-id="client_Country" >Country</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btn_edit" class="btn btn-primary">Save</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript">
$( document ).ready(function() {
var grid = $("#employee_grid").bootgrid({
ajax: true,
rowSelect: true,
post: function ()
{
/* To accumulate custom parameter with the request object */
return {
id: "b0df282a-0d67-40e5-8558-c9e93b7befed"
};
},
url: "response.php",
formatters: {
"commands": function(column, row)
{
return "<button type=\"button\" class=\"btn btn-xs btn-default command-edit\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-edit\"></span></button> " +
"<button type=\"button\" class=\"btn btn-xs btn-default command-delete\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-trash\"></span></button>";
}
}
}).on("loaded.rs.jquery.bootgrid", function()
{
/* Executes after data is loaded and rendered */
grid.find(".command-edit").on("click", function(e)
{
//alert("You pressed edit on row: " + $(this).data("row-id"));
var ele =$(this).parent();
var g_id = $(this).parent().siblings(':first').html();
var g_name = $(this).parent().siblings(':nth-of-type(2)').html();
console.log(g_id);
console.log(g_name);
//console.log(grid.data());//
$('#edit_model').modal('show');
if($(this).data("row-id") >0) {
// collect the data
$('#edit_id').val(ele.siblings(':first').html()); // in case we're changing the key
$('#edit_name').val(ele.siblings(':nth-of-type(2)').html());
$('#edit_salary').val(ele.siblings(':nth-of-type(3)').html());
$('#edit_age').val(ele.siblings(':nth-of-type(4)').html());
} else {
alert('Now row selected! First select row, then click edit button');
}
}).end().find(".command-delete").on("click", function(e)
{
var conf = confirm('Delete ' + $(this).data("row-id") + ' items?');
alert(conf);
if(conf){
$.post('response.php', { id: $(this).data("row-id"), action:'delete'}
, function(){
// when ajax returns (callback),
$("#employee_grid").bootgrid('reload');
});
//$(this).parent('tr').remove();
//$("#employee_grid").bootgrid('remove', $(this).data("row-id"))
}
});
});
function ajaxAction(action) {
data = $("#frm_"+action).serializeArray();
$.ajax({
type: "POST",
url: "response.php",
data: data,
dataType: "json",
success: function(response)
{
$('#'+action+'_model').modal('hide');
$("#employee_grid").bootgrid('reload');
}
});
}
$( "#command-add" ).click(function() {
$('#add_model').modal('show');
});
$( "#btn_add" ).click(function() {
ajaxAction('add');
});
$( "#btn_edit" ).click(function() {
ajaxAction('edit');
});
});
</script>
<script type="text/javascript">
$( document ).ready(function() {
var grid = $("#employee_grid1").bootgrid({
ajax: true,
rowSelect: true,
post: function ()
{
/* To accumulate custom parameter with the request object */
return {
id: "b0df282a-0d67-40e5-8558-c9e93b7befed"
};
},
url: "responseuser.php",
formatters: {
"commands": function(column, row)
{
return "<button type=\"button\" class=\"btn btn-xs btn-default command-edit\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-edit\"></span></button> " +
"<button type=\"button\" class=\"btn btn-xs btn-default command-delete\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-trash\"></span></button>";
}
}
}).on("loaded.rs.jquery.bootgrid", function()
{
/* Executes after data is loaded and rendered */
grid.find(".command-edit").on("click", function(e)
{
//alert("You pressed edit on row: " + $(this).data("row-id"));
var ele =$(this).parent();
var g_id = $(this).parent().siblings(':first').html();
var g_name = $(this).parent().siblings(':nth-of-type(2)').html();
console.log(g_id);
console.log(g_name);
//console.log(grid.data());//
$('#edit_model').modal('show');
if($(this).data("row-id") >0) {
// collect the data
$('#edit_id').val(ele.siblings(':first').html()); // in case we're changing the key
$('#edit_name').val(ele.siblings(':nth-of-type(2)').html());
$('#edit_salary').val(ele.siblings(':nth-of-type(3)').html());
$('#edit_age').val(ele.siblings(':nth-of-type(4)').html());
} else {
alert('Now row selected! First select row, then click edit button');
}
}).end().find(".command-delete").on("click", function(e)
{
var conf = confirm('Delete ' + $(this).data("row-id") + ' items?');
alert(conf);
if(conf){
$.post('responseuser.php', { id: $(this).data("row-id"), action:'delete'}
, function(){
// when ajax returns (callback),
$("#employee_grid1").bootgrid('reload');
});
//$(this).parent('tr').remove();
//$("#employee_grid1").bootgrid('remove', $(this).data("row-id"))
}
});
});
function ajaxAction(action) {
data = $("#frm_"+action).serializeArray();
$.ajax({
type: "POST",
url: "responseuser.php",
data: data,
dataType: "json",
success: function(response)
{
$('#'+action+'_model').modal('hide');
$("#employee_grid1").bootgrid('reload');
}
});
}
$( "#command-add" ).click(function() {
$('#add_model').modal('show');
});
$( "#btn_add" ).click(function() {
ajaxAction('add');
});
$( "#btn_edit" ).click(function() {
ajaxAction('edit');
});
});
</script>
responseuser.php
<?php
//include connection file
include_once("connection.php");
$db = new dbObj();
$connString = $db->getConnstring();
$params = $_REQUEST;
$action = isset($params['action']) != '' ? $params['action'] : '';
$empCls = new Employee($connString);
switch($action) {
default:
$empCls->getEmployees($params);
return;
}
class Employee {
protected $conn;
protected $data = array();
function __construct($connString) {
$this->conn = $connString;
}
public function getEmployees($params) {
$this->data = $this->getRecords($params);
echo json_encode($this->data);
}
function getRecords($params) {
$rp = isset($params['rowCount']) ? $params['rowCount'] : 10;
if (isset($params['current'])) { $page = $params['current']; } else { $page=1; };
$start_from = ($page-1) * $rp;
$sql = $sqlRec = $sqlTot = $where = '';
if( !empty($params['searchPhrase']) ) {
$where .=" WHERE ";
$where .=" ( employee_name LIKE '".$params['searchPhrase']."%' ";
$where .=" OR employee_salary LIKE '".$params['searchPhrase']."%' ";
$where .=" OR employee_age LIKE '".$params['searchPhrase']."%' )";
}
if( !empty($params['sort']) ) {
$where .=" ORDER By ".key($params['sort']) .' '.current($params['sort'])." ";
}
// getting total number records without any search
$sql = "SELECT * FROM info.MyTable where client_Name = ????";
$sqlTot .= $sql;
$sqlRec .= $sql;
//concatenate search sql if value exist
if(isset($where) && $where != '') {
$sqlTot .= $where;
$sqlRec .= $where;
}
if ($rp!=-1)
$sqlRec .= " LIMIT ". $start_from .",".$rp;
$qtot = mysqli_query($this->conn, $sqlTot) or die("error to fetch tot employees data");
$queryRecords = mysqli_query($this->conn, $sqlRec) or die("error to fetch employees data");
while( $row = mysqli_fetch_assoc($queryRecords) ) {
$data[] = $row;
}
$json_data = array(
"current" => intval($params['current']),
"rowCount" => 10,
"total" => intval($qtot->num_rows),
"rows" => $data // total data array
);
return $json_data;
}
}
?>