Как обновить раздел HTML-страницы

#php #html

#php #HTML

Вопрос:

Мне нужен раздел на моей HTML-странице, который будет обновляться всякий раз, когда пользователь выполняет успешный ввод данных. Ввод данных происходит из ввода от пользователя в базу данных MySQL, затем я запрошу таблицу filter по статусу is Successful и отсортирую по дате создания DESC.

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

Ответ №1:

Вы можете попробовать что-то вроде этого.

 <!DOCUMENT>
<html lang="en">
 <head>     
  <title>Auto Load and Refresh Div Every 10 seconds</title>     
  <style>
    #auto_load_div>div{width:100%;max-width:320px;}
  </style>     
 </head>
 <body>     
     <div id="auto_load_div"></div>
     <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
     <script>
      function auto_load(){
        $.ajax({
          url: "data.php",
          cache: false,
          success: function(data){
             $("#auto_load_div").html(data);
          } 
        });
      }     
      $(document).ready(function(){     
        auto_load(); //Call auto_load() function when DOM is Ready     
      });     
      //Refresh auto_load() function after 10000 milliseconds
      setInterval(auto_load,10000);
   </script>
 </body>
</html>

Также нравится это.

HTML

 <div id="divID"> <!-- THE DATA FROM THE FORM VIA PHP --> </div>
<form id='foo' onsubmit="return false">
 <input type='text' name="yourname">
 <input type='submit'>
</form>

отобразите ответ в html, которому вы дали идентификатор.

JQUERY

 $('#foo').submit(function(event){
  $.ajax({
    url: 'index.php',
    type: 'post',
    dataType:'html',   //expect return data as html from server
   data: $('#foo').serialize(),
   success: function(response, textStatus, jqXHR){
      $('#divID').html(response);   //select the id and put the response in the html
    },
   error: function(jqXHR, textStatus, errorThrown){
      console.log('error(s):' textStatus, errorThrown);
   }
 });
});

напишите ваш html здесь … я просто печатаю переменную post здесь… вы можете использовать <table> (html) по мере необходимости

index.php

 echo $_POST['yourname'].

1. Все инструкции по выбору базы данных будут выполнены в data.php ?

2. @4LeaveCover Это правильно, исходя из первого решения.

3. в этом случае мой data.php будет доступен для общественности. Должен ли я беспокоиться?

Ответ №2:

Ajax лучше всего подойдет для вашего приложения. Однако, исходя из того, что вы указали, я думаю, вам придется иметь дело с web-sockets , поскольку вам придется постоянно прослушивать изменения в базе данных. Попробуйте выяснить, как вы это реализуете в php , если вы еще этого не сделали.

1. Вместо частой проверки базы данных, есть ли какие-либо способы отправить уведомление после вставки в базу данных? Это похоже на обратный путь, если вы понимаете, что я имею в виду.

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

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

4. есть библиотеки для web-socket и что касается уведомлений, вы можете жестко запрограммировать это или даже снова найти некоторые библиотеки. Это полностью зависит от вашего приложения и от того, как вы хотите, чтобы оно вело себя.