Как в ajax передать переменную из php

Получение значений переменных из PHP в AJAX

Имеется выпадающий список для выбора определенного человека, после его выбора необходимо с помощью AJAX ниже в поля input вывести его фамилию,имя,отчество и E-mail.

Вот часть из HTML:

PHP код,обрабатывающий выбранного человека:

Кривой AJAX,который должен получать значение переменных из PHP страницы

Подскажите,как правильно описать присвоение значений в SUCCESS, чтобы каждому полю INPUT присвоить значение полученной переменной.

Передача переменных и данных из PHP в JavaScript

У меня есть переменная в PHP, и мне нужно получить ее значение в JavaScript. Как можно это сделать?

У меня есть код PHP, который выглядит так:

<?php

.

$val = $myService->getValue();

?>

И код JavaScript, который требует val и выглядит следующим образом:

<script>

myPlugin.start($val); // я пытаюсь получить ее здесь, но это не работает

<?php myPlugin.start($val); ?>// не работает

myPlugin.start(<?=$val?> // иногда работает, иногда нет

</script>

Ответ 1

1. Используйте AJAX для получения необходимых данных с сервера.

2. Выведите данные куда-нибудь на страницу и используйте JavaScript для получения информации из DOM.

3. Выведите данные прямо в JavaScript.

Используйте AJAX для получения необходимых данных с сервера.

• Лучшее разделение между слоями. Если вы перестанете использовать PHP и захотите перейти к сервлету, REST API или какой-либо другой службе, вам не придется менять большую часть кода JavaScript.

• Более читабельный . JavaScript – это JavaScript, PHP – это PHP. Не смешивая их, вы получаете более читаемый код на обоих языках.

• Обеспечивает асинхронную передачу данных – получение информации из PHP может потребовать больших затрат времени и ресурсов. Иногда вы просто не захотите ждать информацию, загружать страницу и получать к ней доступ.

• Данные не находятся непосредственно в разметке – это означает, что ваша разметка очищена от любых дополнительных данных и только JavaScript видит их.

• Задержка – AJAX создает HTTP-запрос, а HTTP-запросы передаются по сети и имеют сетевые задержки.

• Состояние – данные, полученные с помощью отдельного HTTP-запроса, не будут включать никакой информации из HTTP-запроса, по которому был получен HTML-документ. Вам может понадобит ь ся эта информация (например, если HTML-документ создается в ответ на отправку формы), и, если вы это сделаете, вам придется каким-то образом передать ее. Если вы исключили встраивание данных на страницу (которая у вас есть, если вы используете этот метод), это ограничивает вас файлами cookie/sessions, которые могут быть предметом конкуренции.

Пример реализации

С AJAX вам нужны две страницы, одна из которых — это то, где PHP генерирует вывод, а вторая — где JavaScript получает его:

get-data.php

index.php

<script>

function reqListener () <

console.log(this.responseText);

>

var oReq = new XMLHttpRequest(); // требуемый объект

oReq.onload = function() <

// Здесь вы определяете, что делать с ответом.

// Фактические данные находятся в this.responseText

alert(this.responseText);

>;

oReq.open(«get», «get-data.php», true);

oReq.send();

</script>

Вышеупомянутая комбинация двух файлов отобразит предупреждение «42», когда файл завершит загрузку.

Выведите данные куда-нибудь на страницу и используйте JavaScript для получения информации из DOM.

1. Быстро – операции DOM часто бывают быстрыми, и вы можете относительно быстро хранить и получать доступ к большому количеству данных.

1. Потенциально неопределенная разметка . Обычно для хранения информации используется что-то вроде <input type=hidden>, потому что проще получить информацию из inputNode.value, но это означает, что у вас есть бессмысленный элемент в HTML. В HTML есть элемент <meta> для данных о документе, а в HTML5 появились атрибуты data-* для данных, специально предназначенных для чтения с помощью JavaScript, которые могут быть связаны с определенными элементами.

2. Загрязняет источник . Данные, которые генерирует PHP, выводятся непосредственно в HTML, что означает, что вы получаете большой HTML.

3. Труднее получить структурированные данные . С труктурированные данные должны быть валидным HTML, иначе вам придется самостоятельно выводить и преобразовывать строки.

4. Тесная связь PHP с логикой данных . Поскольку PHP используется в представлении, вы не можете разделить эти два понятия.

Пример реализации

Идея состоит в том, чтобы создать какой-то элемент, который не будет отображаться на странице, но будет виден JavaScript.

index.php

<div style=»display: none;»>

<?php

$output = «42»; // результат операции для вывода

echo htmlspecialchars($output); // необходимо экранировать, т.к. результат не будет корректным в HTML

?>

</div>

<script>

var div = document.getElementById(«dom-target»);

var myData = div.textContent;

</script>

Выведите данные прямо в JavaScript.

• Очень легко реализуется – требуется совсем немного времени для реализации.

• Не загрязняет исходный код – переменные выводятся непосредственно в JavaScript, поэтому DOM не затрагивается.

• Тесно связывает PHP с вашей логикой данных – поскольку PHP используется в представлении и вы не можете разделить их.

Пример реализации

Реализация относительно проста:

<script>

var data = <?php echo json_encode(«42», JSON_HEX_TAG); ?>;

</script>

Ответ 2

Я обычно использую атрибуты data- * в HTML.

<div data-service=»<?php echo $myService->getValue(); ?>»>

</div>

<script>

$(document).ready(function() <

$(‘.service-container’).each(function() <

var container = $(this);

var service = container.data(‘service’);

>);

>);

</script>

В этом примере используется jQuery, но его можно адаптировать для другой библиотеки или Vanilla JavaScript.

Ответ 3

Воспользуйтесь одним из следующих способов :

<script type=»text/javascript»>

var js_variable = ‘<?php echo $php_variable;?>’;

<script>

Или

<script type=»text/javascript»>

var js_variable = <?php echo json_encode($php_variable); ?>;

</script>

Мы будем очень благодарны

если под понравившемся материалом Вы нажмёте одну из кнопок социальных сетей и поделитесь с друзьями.

Как передать переменные и данные из PHP в JavaScript?

у меня есть переменная в PHP, и мне нужно ее значение в моем коде JavaScript. Как я могу получить переменную из PHP в JavaScript?

у меня есть код, который выглядит так:

у меня есть код JavaScript, который должен val и выглядит примерно так:

18 ответов

на самом деле существует несколько подходов к этому. Некоторые требуют больше накладных расходов, чем другие, а некоторые считаются лучше, чем другие.

в определенном порядке:

1. используйте AJAX для получения необходимых данных с сервера.
2. Эхо-данные на страницу где-то, и использовать JavaScript, чтобы получить информацию от DOM.
3. Эхо-данные непосредственно на JavaScript.

в этом посте мы рассмотрим каждый из приведенные выше методы, и посмотреть плюсы и минусы каждого, а также как их реализовать.

1. Используйте AJAX для получения необходимых данных с сервера

этот метод считается лучшим, потому что ваши серверные и клиентские скрипты полностью разделены.

плюсы

• лучшее разделение между слоями — если завтра вы прекратите использовать PHP и захотите перейти на сервлет, REST API или некоторые другой сервис, вам не нужно менять большую часть кода JavaScript.
• более читабельным — JavaScript-это JavaScript, PHP-это PHP. Не смешивая их, вы получаете более читаемый код на обоих языках.
• позволяет асинхронную передачу данных — получение информации из PHP может быть время/ресурсы дорогие. Иногда вы просто не хотите ждать информации, загружать страницу и получать доступ к информации всякий раз.
• данные не находятся непосредственно на разметке — это означает, что ваша разметка очищена от любых дополнительных данных, и только JavaScript видит ее.

минусы

• задержка — AJAX создает HTTP-запрос, а HTTP-запросы переносятся по сети и имеют сетевые задержки.
• государство — данные, полученные с помощью отдельного HTTP-запроса, не будут содержать никакой информации HTTP-запрос, который извлек HTML-документ. Вам может понадобиться эта информация (например, если HTML-документ генерируется в ответ на отправку формы), и, если вы это сделаете, вам придется каким-то образом передать ее. Если вы исключили встраивание данных на странице (что у вас есть, если вы используете этот метод), то это ограничивает вас куки/сеансами, которые могут быть подвержены условиям гонки.

Пример Реализации

С AJAX вам нужно две страницы, одна где PHP генерирует вывод, а второй-где JavaScript получает этот вывод:

get-data.в PHP

Я собираюсь попробовать более простой ответ:

описание проблемы

во-первых, давайте разберемся в потоке событий, когда страница обслуживается с нашего сервера:

• сначала запускается PHP, он генерирует HTML, который подается клиенту.
• затем HTML доставляется клиенту, после того, как PHP будет сделан с ним, я хотел бы подчеркнуть, что как только код покинет сервер-PHP будет сделан с ним и больше не сможет получить доступ он.
• затем HTML с JavaScript достигает клиента, который может выполнять JS на этом html.

так действительно, основная вещь, чтобы помнить здесь, что HTTP не имеет состояния. Как только запрос покинул сервер, сервер не может его коснуться. Таким образом, это оставляет наши варианты:

1. отправить больше запросов от клиента после первоначальный запрос выполняется.
2. кодировать то, что сервер должен был сказать в начальный запрос.

решений

это основной вопрос, который вы должны задать себе:

я пишу веб-сайт или приложение?

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

отправка дополнительных запросов от клиента после выполнения первоначального запроса —медленно как это требует больше HTTP-запросов, которые имеют значительные накладные расходы. Более того, это требует asynchronousity как сделать AJAX-запрос требуется обработчик завершения.

Я бы не рекомендую сделать еще один запрос если ваш сайт не является приложением для получения эта информация с сервера.

требуется быстрое время отклика, которые имеют огромный удар по преобразованию и временам нагрузки. В этом случае выполнение запросов ajax медленно для начального времени безотказной работы и ненужно.

у вас есть два способа решения проблемы

• установить cookie — cookies-это заголовки, отправленные в HTTP-запросах, которые могут читать как сервер, так и клиент.
• закодировать переменную как В JSON — JSON выглядит очень близко к объектам JavaScript и большинство объекты JSON являются допустимыми переменными JavaScript.

настройка cookie на самом деле не очень сложно, вы просто назначаете ему значение:

тут вы можете читать его с помощью JavaScript используя document.cookie :

вот короткий ручной парсер, но ответ, который я связал прямо над этим, лучше протестирован:

Cookies хороши для небольших данных. Это то, что часто делают службы отслеживания.

как только у нас будет больше данных, мы можем кодировать его с помощью JSON внутри переменной JS:

предполагая, что $value is json_encode able на стороне PHP (обычно это так). Этот метод-это то, что StackOverflow делает со своим чатом, например (ТОЛЬКО используя .net вместо php).

приложение

если вы пишете заявление-внезапно начальное время загрузки не всегда так важно, как текущая производительность приложения, и оно начинает окупаться для загрузки данных и кода отдельно.

мой ответ:здесь объясняет, как загружать данные с помощью AJAX в JavaScript:

теперь сервер просто должен содержать /your/url маршрут / файл, содержащий код, который захватывает данные и что-то с ним делает, в вашем случае:

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

Постскриптум: ты должен быть очень известно о векторах атаки XSS, когда вы вводите что-либо из PHP в JavaScript. Это очень трудно правильно избежать значений, и это чувствительно к контексту. Если вы не знаете, как обращаться с XSS, или не знаете об этом — пожалуйста, прочитайте эта статья OWASP, этот и этот вопрос.

Я обычно использую атрибуты data — * в html.

этот пример использует jQuery, но может быть адаптирован для другой библиотеки или ванильного Javascript.

• PHP 5.2.0 или более
• $PHPVar кодируется как UTF-8, Unicode.

просто используйте один из следующих методов.

или

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

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

и print_scripts() метод приведенного выше примера отправит этот вывод:

независимо от того, что сценарий «jquery» запрашивается после «jquery-ui», он печатается раньше, потому что он определен в «jquery-ui», что он зависит от «jquery». Дополнительные данные для «пользовательского скрипта» находятся внутри нового блока скрипта и помещаются перед ним, он содержит mydata объект, который содержит дополнительные данные, теперь доступен для «custom-script».

он не работает, потому что $val не определено, что касается javascript, т. е. php ничего не выводил для $val . Попробуйте просмотреть источник в вашем браузере, и вот что вы увидите:

это не работает, потому что php попытается обработать myPlugin как константа, и когда это не удастся, он попытается рассматривать его как строку ‘myPlugin’ который он попытается объединить с выходом функции php start() и поскольку это не определено, это приведет к фатальной ошибке

хотя это, скорее всего, сработает, так как php создает допустимый javascript с ожидаемыми аргументами, если это не удастся, скорее всего, потому что myPlugin еще не готов. Проверьте порядок исполнения.

также вы должны отметить, что php out put небезопасен и должен быть отфильтрован с помощью json_encode()

редактировать

Потому Что Я не заметил отсутствующую скобку в myPlugin.start(<?=$val?> :-\

как указывает @Second Rikudo, чтобы он работал правильно $val необходимо будет содержать закрывающую скобку, например: $val=»42);»

означает, что php теперь будет производить myPlugin.start(42); и будет работать, как ожидалось, при выполнении javascript

— после попытки некоторое время Хотя это работает , однако это замедляет работу. поскольку php-это скрипт на стороне сервера, а javascript-на стороне пользователя.

Я вышел с простым методом назначения переменных JavaScript с помощью PHP.

он использует атрибуты данных HTML5 для хранения переменных PHP, а затем назначается JavaScript при загрузке страницы.

полный учебник можно найти здесь

вот один, который я не вижу в качестве опции. это похоже на использование AJAX, но явно разные.

сначала установите источник скрипта непосредственно в файл PHP.

вы даже можете передать переменную обратно в файл PHP, например:

затем в «your_php_file.в PHP»:

вот вам ‘PHP’ чтобы использовать эту переменную:

Теперь у вас есть переменная JS с именем ‘name’ , а вот это ваше ‘Javascript’ чтобы использовать эту переменную :

предположим, что переменная является числом, в таком случае, это проще!—11—>

выход:

Допустим, ваша переменная не является целым числом, но если вы попробуете метод выше, вы получите что-то вроде этого:

но в JavaScript это синтаксическая ошибка.

Итак, в php у нас есть вызов функции json_encode это кодирует строку в объект json.

С abcd в json это «abcd» ,так это выглядит так:

вы можете использовать тот же метод для массивов:

и ваш JavaScript выглядит так:

вывод на консоль

после многих исследований я нашел самый простой способ легко передать все виды переменных.

в вашем PHP-скрипте у вас есть две переменные, и вы пытаетесь отправить их в свои js-скрипты:

в любом из ваших javascript, вызванных на Вашей странице, просто вызовите vars.

надеюсь, я помог кому-нибудь !

я предположу, что данные для передачи являются строкой.

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

Итак, мы вернулись к побегу. json_encode($string) работает если вы кодируете исходную строку как UTF-8 сначала, если она еще не, потому что json_encode требует данных UTF-8. Если строку в ISO-8859-1, то вы можете просто использовать json_encode(utf8_encode($string)) ; в противном случае вы всегда можете использовать iconv сначала выполните преобразование.

но есть большой gotcha. Если вы используете его в событиях, вам нужно запустить htmlspecialchars() о результате, чтобы сделать его правильным кодом. И тогда вы должны либо быть осторожны, чтобы использовать двойные кавычки, чтобы заключить событие, или всегда добавлять ENT_QUOTES в функции htmlspecialchars. Например:

, вы не могу использовать htmlspecialchars на обычном JS-коде (код заключен в <script> . </script> теги). Это делает использование этой функции склонной к ошибкам, забывая htmlspecialchars результат при написании кода события.

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

функция требует PHP 5.4+. Пример использования:

теперь вы можете получить значение с помощью DOM, использовать innerHTML идентификатора span, в этом случае вам не нужно делать никаких вызовов на сервер, или ajax или любую другую вещь.

ваша страница будет печатать его с помощью php, и вы javascript получите значение с помощью DOM.

вот как я это делаю (есть много способов):

1. преобразование данных в JSON
2. вызов AJAX получать JSON
3. преобразование JSON на в JavaScript объект

Шаг 1

Шаг 2

и это сработает. Это просто назначение переменной javascript, а затем передача значения существующей переменной php. Поскольку php пишет строки javascript здесь, он имеет значение переменной php и может передавать ее напрямую.