У меня есть функция обновления ajax с некоторыми специфическими проблемами, и я уверен, что для того, чтобы она сработала на 100%, нужно просто настроить ее.
Я кратко изложу нижеприведенные вопросы настолько четко, насколько смогу.
У меня есть два файла, которые взаимодействуют друг с другом:
- orders.php
- orders -ured.vc.php
Мой ajax пытается обновить значение int таблицы на основе нажатой кнопки.НЕТ = 0, ДА = 1, ОТМЕНА = 2.
orders.php
начало страницы
<?php
session_start();
require_once('orders-claimed.vc.php');
?>
столбец таблицы кнопок:
<td data-target="scheduled">
<input id='userId' type='hidden'/>
<?php
if ($rowOrder['scheduled'] == 1) {
?>
<a href="#" data-role="update" data-id="<?php echo $rowOrder['orderid'] ;?>"><button class="btn-success">YES</button></a>
<?php
} else if ($rowOrder['scheduled'] == 0) {
?>
<a href="#" data-role="update" data-id="<?php echo $rowOrder['orderid'] ;?>"><button class="btn-danger">NO</button></a>
<?php
} else if ($rowOrder['scheduled'] == 2) {
?>
<a href="#" data-role="update" data-id="<?php echo $rowOrder['orderid'] ;?>"><button class="btn-warning">CANCELLED</button></a>
<?php
}
?>
</td>
модал, используемый для взаимодействия с таблицей
<!-- Modal content-->
<div class="modal-content" style="width: 300px; margin: 0 auto;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="form-group">
<a href="#" id="update_yes" class="btn btn-success text-center center-block">YES</a><br>
<a href="#" id="update_no" class="btn btn-danger text-center center-block">NO</a><br>
<a href="#" id="update_cancelled" class="btn btn-warning text-center center-block">CANCEL</a>
</div>
</div>
</div>
</div>
ajax-код
<script>
$(document).ready(function(){
// append values in input fields
$(document).on('click','a[data-role=update]',function(){
var id = $(this).data('id');
var scheduled = $('#'+id).children('td[data-target=scheduled]').text();
$('#userId').val(id);
$('#myModal').modal('toggle');
});
// now create event to get data from fields and update in database
$('#update_no').click(function(){
var id = $('#userId').val();
var scheduled = 0;
$.ajax({
url : 'orders-claimed.vc.php',
method : 'post',
data : {scheduled: scheduled , id: id},
success : function(response){
// now update user record in table
$('#'+id).children('td[data-target=scheduled]').html('<a href="#"><button class="btn-danger">NO</button></a>');
$('#myModal').modal('toggle');
}
});
});
$('#update_yes').click(function(){
var id = $('#userId').val();
var scheduled = 1;
$.ajax({
url : 'orders-claimed.vc.php',
method : 'post',
data : {scheduled: scheduled , id: id},
success : function(response){
// now update user record in table
$('#'+id).children('td[data-target=scheduled]').html('<a href="#"><button class="btn-success">YES</button></a>');
$('#myModal').modal('toggle');
}
});
});
$('#update_cancelled').click(function(){
var id = $('#userId').val();
var scheduled = 2;
$.ajax({
url : 'orders-claimed.vc.php',
method : 'post',
data : {scheduled: scheduled , id: id},
success : function(response){
// now update user record in table
$('#'+id).children('td[data-target=scheduled]').html('<a href="#"><button class="btn-warning">CANCELLED</button></a>');
$('#myModal').modal('toggle');
}
});
}); });
</script>
Обратите внимание, что весь приведенный выше код находится в одном файле (orders.php)
- Имя таблицы SQL "order"
это мои расширения на странице.большинство из них хранятся в папке и связаны между собой.
<script src="../_lib/v/jquery.slim.min.js"></script>
<script src="../_lib/v/bootstrap/js/bootstrap.js"></script>
<script src="../_lib/v/jquery-ui/jquery-ui.js"></script>
<script src="../_lib/v/jscolor/jscolor.js"></script>
<script src="js/cms.js"></script>
<link href="../_lib/v/bootstrap/css/bootstrap.min.css" rel="stylesheet">
Ajax не работает с файлом slim.min.js и получает сообщение «не является ошибкой функции», поэтому я изменил его на обычную версиюJQuery от https://code.jquery.com/jquery-3.3.1.js
ПРОБЛЕМА
Если я переключаюсь на полную версию JQuery, столбец обновляется, но сеанс (зарегистрированный пользователь) заканчивается и выходит из системыавтоматически.Почему это происходит?
Моя вторая проблема - в файле orders-said.vc.php
db.php
<?php
class config_db {
public function init() {
$db = new PDO('*MY DATABASE DETAILS GO HERE*');
date_default_timezone_set('Hongkong');
return $db;
}
}
?>
orders.claimed.vs.php
подключение к базе данных:
$routePath = "../";
require_once($routePath . "_config/db.php");
$dbConfig = new config_db();
$db = $dbConfig->init();
SQL обновление
if(isset($_POST['id'])){
$orderid = $_POST['id'];
$scheduled = $_POST['scheduled'];
$stmt = $db->prepare("UPDATE order SET scheduled = '$scheduled' WHERE orderid = '$orderid'");
$stmt->execute(); }
ПРОБЛЕМА
приведенный выше код SQL не обновляет таблицу (тот, что показан на скриншоте, но ajax просто обновляет внешний видкнопки из функций успеха (возвращается к исходному значению при обновлении страницы). Я хотел бы знать, в чем проблема. Он должен подключаться к кнопкам, поскольку он использует "if (isset ($ _ POST ['id'])) ".
Надеюсь, я дал четкое объяснение двум моим проблемам, спасибо за любую помощь.
ОБНОВЛЕНИЕ Iиспользовал следующий код ниже для проверки ошибки обновления кнопки:
console.log( 'scheduled: ' + scheduled + ' orderid: ' + $('#userId').val() );
при обновлении кнопки и обновлении страницы, которая также выходит из сеанса, я получаю foошибка свечения:
jquery-ui.js:1951 Uncaught TypeError: Cannot read property 'step' of undefined
at String.<anonymous> (jquery-ui.js:1951)
at each (jquery.slim.min.js:2)
at Function.color.hook (jquery-ui.js:1913)
at jquery-ui.js:1963
at jquery-ui.js:2005
at jquery-ui.js:14
at jquery-ui.js:16