Как получить данные из базы данных на основе пользовательского ввода и отобразить в виде массива JSON, используя асинхронный POST в переполнении стека

У меня есть 1 php страница, которая устанавливает соединение с базой данных и извлекает данные из базы данных, используя JSON массив (этот код работает нормально).

index2.php

<?php

class logAgent
{
const CONFIG_FILENAME = "data_config.ini";

private $_dbConn;
private $_config;

function __construct()
{
$this->_loadConfig();


$this->_dbConn = oci_connect($this->_config['db_usrnm'],
$this->_config['db_pwd'],
$this->_config['hostnm_sid']);
}
private function _loadConfig()
{
// Loads config
$path = dirname(__FILE__) . '/' . self::CONFIG_FILENAME;
$this->_config = parse_ini_file($path) ;
}
public function fetchLogs() {

$sql = "SELECT REQUEST_TIME,WORKFLOW_NAME,EVENT_MESSAGE
FROM AUTH_LOGS WHERE USERID = '".$uid."'";

//Preparing an Oracle statement for execution
$statement = oci_parse($this->_dbConn, $sql);

//Executing statement
oci_execute($statement);
$json_array = array();

while (($row = oci_fetch_row($statement)) != false) {
$rows[] = $row;
$json_array[] = $row;
}
json_encode($json_array);
}

}

$logAgent = new logAgent();
$logAgent->fetchLogs();
?>

Я создал еще одну HTML-страницу, где я беру один ввод (идентификатор пользователя) от пользователя. На основании идентификатора пользователя я получаю больше данных об этом пользователе из базы данных. Как только пользователь введет идентификатор пользователя и нажмет кнопку «Get_Logs», из базы данных будет извлечено больше данных.

<!DOCTYPE html>
<html>
<head>
<title>User_Logs</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="script.js"></script>
</head>

<body>
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST"){
$uid =$_POST["USERID"];

}
?>
<form method="POST" id="form-add" action="index2.php">
USER_ID: <input type="text" name="USERID"/><br>
<input type="submit" name="submit" id = "mybtn" value="Get_Logs"/>
</form>
</body>
</html>

Мой сценарий:

$(document).ready(function(){
$("#mybtn").click(function(){
$.POST("index2.php", {
var myVar = <?php echo json_encode($json_array); ?>;
});

});
})

Этот код работает нормально. Однако это синхронно POST & это обновляет мою страницу, однако я хочу использовать асинхронный POST, Как я могу это сделать? Я никогда не делал это асинхронное POST-кодирование. Пожалуйста, помогите.

я попробовал это & это не ошибка, но нет вывода. Может кто-нибудь, пожалуйста, проверьте, что не так в моем коде.

$(document).ready(function(){
$("#mybtn").click(function(e){
e.preventDefault();
$.post("index2.php", {data :'<?php echo json_encode($json_array);?>'
})

});
})

0

Решение

Я предполагаю, что index2.php — это еще одна страница php (не та же самая), и она возвращает данные, которые вы хотите обновить, на странице, на которой вы запускаете этот код.

$(document).ready(function(){
$("#mybtn").click(function(e){
e.preventDefault();
$.POST("index2.php", {
var myVar = "<?php echo json_encode($json_array); ?>";
});

});
})

вам нужно добавить в свой обработчик клика protectDefault, чтобы форма не отправлялась. Это остановит отправку формы и перезагрузку страницы. Внутри POST вы можете настроить логику для обновления страницы обновленными данными (без перезагрузки)

1

Другие решения

Можете ли вы попробовать это,

$(document).ready(function(){
$("#mybtn").click(function(event){
event.preventDefault();
$.POST("index2.php", {
var myVar = <?php echo json_encode($json_array); ?>;
});

});
});

Также в HTML удалить action в form

<form method="POST" id="form-add">
USER_ID: <input type="text" name="USERID"/><br>
<input type="submit" name="submit" id = "mybtn" value="Get_Logs"/>
</form>

Редактировать :
Можете ли вы попробовать это, пожалуйста? Второй параметр для post берет объект.

 $(document).ready(function(){
$("#mybtn").click(function(event){
event.preventDefault();
var myVar = <?php echo json_encode($json_array); ?>;
console.log(myVar);
$.post("submit.php", {
'id': myVar
},function(data){
console.log(data);
});
});
});
0