Вызов скрипта php без обновления страницы

@JokerZ · Регистрация: 15.10.2015

Студворк — интернет-сервис помощи студентам

Всем привет,
программировал до этого на php.. поэтому пока в javascript ноль..

есть скрипт php он выводит данные из mysql в таблицу.

как сделать на javascript что бы эта таблица обновлялась.

(т.е. в БД вносятся значения через php, и выводятся через php )

возможно сделать чтобы скрипт php вызывался без обновления страницы?

@kalabuni · 11.03.2016, 20:25

Сообщение от JokerZ

есть скрипт php он выводит данные из mysql в таблицу.

учитесь говорить правильно
у вас есть файл (не скрипт, а именно файл -- это важно!), написанный на языке PHP, который прочитывает данные из БД, на основе этих данных формирует HTML-код некой таблицы и затем сформированный код выводит

теперь ответ: сделать запрос к PHP-файлу без обновления страницы можно и можно от этого файла получить ответ (в виде строки со сформированным HTML-кодом таблицы)
смотрите http://xmlhttprequest.ru/

@JokerZ · 11.03.2016, 22:10 **[ТС]**

Сообщение от kalabuni

учитесь говорить правильно
у вас есть файл (не скрипт, а именно файл -- это важно!), написанный на языке PHP, который прочитывает данные из БД, на основе этих данных формирует HTML-код некой таблицы и затем сформированный код выводит
теперь ответ: сделать запрос к PHP-файлу без обновления страницы можно и можно от этого файла получить ответ (в виде строки со сформированным HTML-кодом таблицы)
смотрите http://xmlhttprequest.ru/

да, вы правильно меня поняли..
но в php код - тоже скриптом называется(спорить не буду, просто всегда так я называл файл php)

примере посмотрел..
var xmlhttp = getXmlHttp()
xmlhttp.open('GET', '/My_PHP_code.php', false);
xmlhttp.send(null);
if(xmlhttp.status == 200) {
xmlhttp.responseText;
}

а как потом вывести текст из xmlhttp.responseText?

извините конечно, но после php очень трудно ориентироваться..

@kalabuni · 12.03.2016, 03:58

Сообщение от JokerZ

но в php код - тоже скриптом называется(спорить не буду, просто всегда так я называл файл php)

"скриптом" можно назвать часть кода файла, даже только одну какую-то функцию
а при работе с "транспортом" XMLHTTPRequest нас интересует именно файл целиком, адрес которого можно указать в методе open ()

Сообщение от JokerZ

а как потом вывести текст из xmlhttp.responseText?

из первого вашего сообщения я понял, что вам надо "обновить таблицу"
и, как мы с вами выше договорились, в responseText будет не просто какой-то "текст", а HTML-код этой самой таблицы

"обновить" в данном случае означает, что имеющаяся на странице HTML-таблица удаляется, а вместо неё с помощью "пришедшего" от PHP-файла HTML-кода создаётся новая таблица

имеющуюся на странице таблицу надо однозначно идентифицировать (для чего проще всего ещё в PHP-файле надо прописать ей уникальный id)
затем надо перед (или после) этой "старой" таблицей создать "новую", и, наконец, "старую" удалить

примерно так это будет выглядеть (если у таблицы есть id="myTBL"):

JavaScript
1
2
3
4
5
6
7
8
9
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState == 4)
   {
   var tbl = document.getElementById ('myTBL');                 // сохраняем "старую таблицу в переменной
   tbl.insertAdjacentHTML('beforebegin', xmlhttp.responseText); // создаём из полученного HTML-кода "новую" таблицу перед "старой"
   tbl.parentNode.removeChild (tbl);                            // удаляем "старую таблицу"
   }
}

@Padimanskas · 12.03.2016, 05:37

Мдя

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

Код на PHP может генерировать данные в виде JSON или XML. Через AJAX, эти данные получает JavaScript-программа которая генерирует из них элементы строк для пустой статичной таблицы. Сейчас я бы посоветовал использовать метод ajax из jQuery в котором инкапсулировано все необходимое для работы с асинхронными запросами. Просто чтобы сразу достичь желаемого результата параллельно изучая низкоуровневые механизмы. Так же будет полезно почитать решения на каком-нибудь стековерфлоу и полистать соответствующие издания.

@kalabuni · 12.03.2016, 06:40

JokerZ, на размышления/измышления товарища выше внимания не обращайте.

второй параметр метода open () подразумевает передачу методу строки с адресом (URL), а адрес может быть только у поименованной области на носителе данных (а это - как раз определение файла)
дилетантские рассуждения о том, что якобы некий (видимо, висящий в воздухе вне файла) код на PHP может чего-то там генерировать, всерьёз воспринимать не стоит

Рекомендация "использовать JQuery" равносильна совету изучать пьесы Шекспира по комиксам

@JokerZ · 12.03.2016, 11:40 **[ТС]**

Сообщение от kalabuni

из первого вашего сообщения я понял, что вам надо "обновить таблицу"
и, как мы с вами выше договорились, в responseText будет не просто какой-то "текст", а HTML-код этой самой таблицы
"обновить" в данном случае означает, что имеющаяся на странице HTML-таблица удаляется, а вместо неё с помощью "пришедшего" от PHP-файла HTML-кода создаётся новая таблица
имеющуюся на странице таблицу надо однозначно идентифицировать (для чего проще всего ещё в PHP-файле надо прописать ей уникальный id)
затем надо перед (или после) этой "старой" таблицей создать "новую", и, наконец, "старую" удалить
примерно так это будет выглядеть (если у таблицы есть id="myTBL"):

спасибо за пояснения..

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var xmlhttp = getXmlHttp()
xmlhttp.open('GET', '/My_PHP_code.php', false);
xmlhttp.send(null);
if(xmlhttp.status == 200) {
xmlhttp.responseText;
}
 
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState == 4)
   {
   var tbl = document.getElementById ('myTBL');                 // сохраняем "старую таблицу в переменной
   tbl.insertAdjacentHTML('beforebegin', xmlhttp.responseText); // создаём из полученного HTML-кода "новую" таблицу перед "старой"
   tbl.parentNode.removeChild (tbl);                            // удаляем "старую таблицу"
   }
}

получился такой скрипт.
Его вставить в место вывода таблицы?

Добавлено через 18 минут
Попробовал, но не работате.. php выдает таблицу отделно, а вот index.html ни чего не выводит

index.html

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<html>
 
<head>
 
</head>
 
<body>
 
 
<script>
var xmlhttp = getXmlHttp()
xmlhttp.open('GET', '/table.php', false);
xmlhttp.send(null);
if(xmlhttp.status == 200) {
xmlhttp.responseText;
}
 
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState == 4)
   {
   var tbl = document.getElementById ('myTBL');                 // сохраняем "старую таблицу в переменной
   tbl.insertAdjacentHTML('beforebegin', xmlhttp.responseText); // создаём из полученного HTML-кода "новую" таблицу перед "старой"
   tbl.parentNode.removeChild (tbl);                            // удаляем "старую таблицу"
   }
}
</script>
 
 
</body>
 
</html>

table.php

PHP
1
2
3
4
5
6
7
8
9
10
11
12
<?
echo "<table id=\"myTBL\">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>";
?>

@kalabuni · 12.03.2016, 14:11

Сообщение от JokerZ

Попробовал, но не работате

конечно, не будет "работате" -- странноватый у вас какой-то диалект

во-первых, при попытке исполнить строку 22 вашего последнего кода браузер впадёт в ступор
ведь читает браузер код, как и мы с вами, -- построчно, сверху вниз
и когда он дойдёт до строки 22, он ещё не встретит тега с id="myTBL", поэтому "вернуть этот тег" браузер не сможет

во-вторых, ещё раз отсылаю вас к ресурсу http://xmlhttprequest.ru/ -- вы как-то небрежно в первый раз с ним ознакомились -- у вас перепутан порядок использования методов, а проверка статуса вообще "зависла в воздухе" (хотя должна быть внутри функции)

--------------------------------
кроме того, опишите простым (непрограммным) языком -- как вы представляете себе порядок обновления

сейчас ваш код представляет из себя следующее "недоразумение":

старт
команда обновить таблицу (которой ещё даже нет на странице)
первый вывод таблицы на страницу
конец

а должно быть так:

старт
первый вывод таблицы на страницу
команда на обновление таблицы по какому-то событию (или периодически через какой-то интервал времени)
конец

@JokerZ · 12.03.2016, 21:28 **[ТС]**

Сообщение от kalabuni

а должно быть так:
старт
первый вывод таблицы на страницу
команда на обновление таблицы по какому-то событию (или периодически через какой-то интервал времени)
конец
__________________

Ясно. теперь понял немного :-)

По какому событию рекомендуете обновлять?
мне бы желательно чтобы обновлялась после того как в mysql изменились данные (но это наверное не реализовать)

как сделать например по таймеру, каждые 30 секунд?

а на прямую можно javascript к базе обратиться?

Добавлено через 49 минут
еще почитал разные примеры, создал такой..
работает.

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

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<script>
           // ЭТО ТО ЧТО МЫ ОБРАБАТЫВАЕМ Т.Е РЕЗУЛЬТАТ ОТВЕТА СЕРВЕРА СМОТРИМ Файл table.php
    function showContent(link) {
        var cont = document.getElementById('contentBody');
        var loading = document.getElementById('loading');
        //cont.innerHTML = loading.innerHTML;
        var http = createRequestObject();               // создаем ajax-объект
        if( http ) {
            http.open('get', link);                 // инициируем загрузку страницы
            http.onreadystatechange = function () {         // назначаем асинхронный обработчик события
            if(http.readyState == 4) {
                                
 var tbl = document.getElementById ('myTBL');                 // сохраняем "старую таблицу в переменной
   tbl.insertAdjacentHTML('beforebegin', http.responseText); // создаём из полученного HTML-кода "новую" таблицу перед "старой"
   tbl.parentNode.removeChild (tbl);      
                }
            }
            http.send(null);
        } else {
            document.location = link;   // если ajax-объект не удается создать, просто перенаправляем на адрес
        }
    }
 
    // создание ajax объекта
    function createRequestObject() {
        try { return new XMLHttpRequest() }
        catch(e) {
            try { return new ActiveXObject('Msxml2.XMLHTTP') }
            catch(e) {
                try { return new ActiveXObject('Microsoft.XMLHTTP') }
                catch(e) { return null; }
            }
        }
    }
</script>

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<body>
 
<table id="myTBL">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>...</td>
  </tr>
</table>
 
    <p>update</p>
          <form><input onclick="showContent('table.php')" type="button" value="update"> 
    </form>
 
    <div id="contentBody">
    </div>
 
    <div id="loading" style="display: none">
    Идет загрузка...
    </div>
 
</body>

Добавлено через 29 минут
попробовал вставить в конце кода
setInterval(showContent('table.php'), 5000) - так таблица сразу обновляется. и через 5 секунд не происходит обновление..
что не так?

@Padimanskas · 12.03.2016, 22:25

Сообщение от kalabuni

второй параметр метода open () подразумевает передачу методу строки с адресом (URL), а адрес может быть только у поименованной области на носителе данных (а это - как раз определение файла)

Сейчас URI адресация некоим образом не относится к файловой системе, это всего лишь пространство имен описанное в стандарте(просто строка разделенная слешем). Условно адресует документ на сервере, но так же не гарантирует что адрес сопоставим с физическим местонахождением документа. То что в строке написано .php ни о чем не говорит.

JavaScript
1
2
3
app.get('path/to/file.php', function(req, res) {
  res.type('pdf').sendFile('text.txt');
});

Если ты мог заметить PHP здесь отсутствует по определению.

Сообщение от kalabuni

дилетантские рассуждения о том, что якобы некий (видимо, висящий в воздухе вне файла) код на PHP может чего-то там генерировать, всерьёз воспринимать не стоит
Рекомендация "использовать JQuery" равносильна совету изучать пьесы Шекспира по комиксам

Это чисто субъективные доводы.

Сообщение от kalabuni

на размышления/измышления товарища выше внимания не обращайте.

Тамбовский волк тебе товарищ. Пациент

@kalabuni · 12.03.2016, 22:41

Padimanskas, язык помойте
с мылом

@alexsamos33 · 13.03.2016, 10:56

Не по теме:

kalabuni, Padimanskas, Ну хватит вам уже! :stop::umnik::negative:

Сообщение от JokerZ

попробовал вставить в конце кода
setInterval(showContent('table.php'), 5000) - так таблица сразу обновляется. и через 5 секунд не происходит обновление..
что не так?

JavaScript
1
setInterval(function() { showContent('table.php') }, 5000)

надо так.
А теперь объясняю:
Если вызвать функцию со скобками () , то будет передана не сама функция, а результат её выполнения, чтобы передать саму функцию, нужно вызвать её без скобак...
Подробнее прочитать можно здесь.

Сообщение от JokerZ

а на прямую можно javascript к базе обратиться?

Нет нельзя, т.к. база данных находится на сервере, а javascript выполняется на клиенте в браузере.

Но есть и специальные клиентские (локальные) хранилища, например localStorage, cookies, они как раз и предназначены для работы с ними на клиенте...

Новые блоги и статьи Все статьи Все блоги /
Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .	Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .	Использование значений реквизитов справочника в документе, с определенными условиями и правами Maks 07.04.2026 1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .

@JokerZ 0 / 0 / 0 Регистрация: 15.10.2015 Сообщений: 47

	Вызов скрипта php без обновления страницы 11.03.2016, 20:06. Показов 4965. Ответов 11 Метки нет (Все метки) Всем привет, программировал до этого на php.. поэтому пока в javascript ноль.. есть скрипт php он выводит данные из mysql в таблицу. как сделать на javascript что бы эта таблица обновлялась. (т.е. в БД вносятся значения через php, и выводятся через php ) возможно сделать чтобы скрипт php вызывался без обновления страницы? 0

@Padimanskas Superposition 950 / 615 / 256 Регистрация: 27.10.2013 Сообщений: 2,083
	12.03.2016, 05:37
	Мдя файл это сущность ОС. Никакого отношения к конкретным данным он не имеет, потому что этого файла может не быть вообще(предположим фрагменты в облаке, извлекается из бд, генерируется налету и т.п.). Скрипт это правильное определение, можно применять характерные синонимы вроде листинг, исходный код, текст программы, распечатка кода и т.д. непринципиально. Код на PHP может генерировать данные в виде JSON или XML. Через AJAX, эти данные получает JavaScript-программа которая генерирует из них элементы строк для пустой статичной таблицы. Сейчас я бы посоветовал использовать метод ajax из jQuery в котором инкапсулировано все необходимое для работы с асинхронными запросами. Просто чтобы сразу достичь желаемого результата параллельно изучая низкоуровневые механизмы. Так же будет полезно почитать решения на каком-нибудь стековерфлоу и полистать соответствующие издания. 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	12.03.2016, 06:40
	JokerZ, на размышления/измышления товарища выше внимания не обращайте. второй параметр метода open () подразумевает передачу методу строки с адресом (URL), а адрес может быть только у поименованной области на носителе данных (а это - как раз определение файла) дилетантские рассуждения о том, что якобы некий (видимо, висящий в воздухе вне файла) код на PHP может чего-то там генерировать, всерьёз воспринимать не стоит Рекомендация "использовать JQuery" равносильна совету изучать пьесы Шекспира по комиксам 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	12.03.2016, 22:41
	Padimanskas, язык помойте с мылом 0