Невозможно обновить sh таблицу, в которой данные поступают из mysql и отображаются через код php - PullRequest
Новая
       6

Невозможно обновить sh таблицу, в которой данные поступают из mysql и отображаются через код php

0 голосов
/ 24 апреля 2020

Таким образом, данные в базе данных поступают каждую минуту, и у меня нет проблем с получением данных в таблице html, но я не могу заставить таблицу переосмыслить sh. Мое временное решение сейчас состоит в том, чтобы обновлять sh всю страницу каждые 5 секунд, что недостаточно, потому что каждый раз, когда я набираю в поле ввода значение исчезает. Я, вероятно, рассмотрел каждое решение на stackoverflow, но я не могу заставить ни одно из них работать. Я даже попробовал с датой jquery, но она тоже не сработала. Пожалуйста, помогите мне. Любая помощь будет принята с благодарностью. Ниже мой рабочий код: 

<!DOCTYPE html>
<html>
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>


<style>
.student_label{
color:black;
font-size: 28px;
FONT-WEIGHT: 640;
}
</style>
</head>




<body">
<div class="container-fluid">

<div class="row">

<div class = "col-lg-6 col-sm-6 col-md-6 col-6">
<label class = "student_label">student:</label>
</div>

<div class = "col-lg-6 col-sm-6 col-md-6 col-6">

<input class="form-control" id="myInput" type="text" placeholder="Filter . .">

</div>
</div>

<div class="row mt-1">
<div class = "col-lg-12 col-sm-12 col-md-12 col-12">
<?php
$servername = "localhost";
$username = "";
$password = "";
$dbname = "schooldata";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

$List = ["class1.table, class2.table"];

echo '<table id="maintable" class= "table table-sm table-bordered table-hover"><thead class = "thead-dark"><tr><th>Ticker</th><th>Ema Crossover</th><th>RSI Value</th></tr></thead>';

foreach($List as $value){
$append = "_students";
$sql = "SELECT *  FROM `".$value.$append."` ORDER BY id DESC LIMIT 1";

$result = $conn->query($sql);

if ($result->num_rows > 0) {

    // output data of each row
    while($row = $result->fetch_assoc()) {
        echo "<tbody id='myTable'><tr><td>" .  $row["id"]. "</td><td> " .  $row["student"]. "</td><td> " .  $row["class"]. "</tbody></td></tr>";
    }

} else {
    echo "0 results";
}

}


echo '</table>';

$conn->close();
?>
</div>
</div>



</div>
<script>

setTimeout(function(){
   window.location.reload(1);
}, 5000);


$(document).ready(function(){
  $("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $("#myTable, #main").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });
});




</script>



</body>
</html>

Ответы [ 2 ]

1 голос
/ 24 апреля 2020

Проблема, с которой вы сталкиваетесь, связана с вашим подходом. Я собираюсь обсудить общее решение проблемы, просто чтобы указать вам правильное направление.

Рассмотрим, что делает ваш код выше:

Когда на ваш веб-сервер поступает запрос для example.com/index.php (или как вы его называете) веб-сервер запускает интерпретатор PHP, который просматривает код и подготавливает полную страницу HTML. Затем веб-сервер передает эту страницу обратно клиенту.

Важно, чтобы вы понимали, как веб-сервер и интерпретатор PHP работают вместе. То, что вы разработали, - это веб-страница - вот и все, и все, что когда-либо будет. Если вы хотите автоматически обновить часть веб-страницы, вам нужно сделать что-то другое, например:

  1. клиент запрашивает веб-страницу, например 'example.com/ index. php '
  2. веб-сервер выполняет код в index.php и отправляет страницу HTML обратно клиенту
  3. , теперь пользователь хочет обновить часть страницы. Javascript код, выполняемый на клиенте, отправляет запрос на другой URL-адрес, настроенный для отправки только той части, которую хочет клиент
  4. веб-сервер выполняет другой код, который отправляет обратно только данные для части страницы, которая требует обновления
  5. Javascript на клиенте, получают эти обновленные данные и изменяют существующую страницу для отображения новых данных.

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

Вот как это делается, в общих чертах.

0 голосов
/ 24 апреля 2020

Вам нужно использовать Javascript, чтобы это работало. Невозможно выполнить эту работу только с PHP, поскольку PHP отображается на стороне сервера. После того как страница поступила в ваш браузер, сервер для повторной визуализации страницы отсутствует.

Вам потребуется

  • Создать конечную точку API, которая возвращает содержимое базы данных как JSON используя PHP
  • Используйте Javascript .fetch для подключения к этой новой конечной точке и получения данных оттуда
  • Заставьте Javascript обновить таблицу соответствующим образом
  • Вспоминайте метод Javascript каждые 5 секунд

Чтобы вы почувствовали себя здесь, это быстрый, а не псевдокодный «предварительный просмотр» того, как этого добиться.

api. php

header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: access");
header("Access-Control-Allow-Methods: GET");
header('Content-Type: application/json');

// add some try catch around this
$pdo = Create DB Connection
$data = $pdo fetch data
http_response_code(200);
echo json_encode($data);

рендер. js

cont reload = function() {
 fetch('/api') // get the data from API
  .then((response) => {
    return response.json(); // decode json
  })
  .then((data) => {
     // Find out whats new in (data) - or completely re-render the table using Javascript
    [CODE]
    setTimeout(reload, 5000); // then, after 5 seconds, reload again
  });
}

reload();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...