Как сейчас принято передавать данные из PHP в JS?

Вопросы по вёрстке и JavaScript
Аватара пользователя
girmate
Сообщения: 1534
Зарегистрирован: 2015.10.27, 12:52

Как сейчас принято передавать данные из PHP в JS?

Сообщение girmate »

Хочу в yii2 сформировать массив, чтобы затем его передать в JS.
Например, где-то в контроллере сам массив $listMonth = ['январь' , 'февраль', 'март'];
Теперь я хочу его использовать в коде js.
Где-то во вью:

Код: Выделить всё

<?php
$this->registerJs("
    $(document).on('click', 'a.btn-show-attribute', function(e){
    var $listMonth = [???];
    ...
Примечание: Использоваться будет в двух селектах. В одном выбираю параметр, во втором селекте - другие параметры, зависящие от первого. Для чего собираюсь сформировать кучу массивов, которые будут обходится для построения (и замены) списков, если изменяется первый селект.

Насколько я знаю, раньше все это дело прятали в input type=hidden. Но вроде как это чисто для форм. Потом где-то вскользь я видел что можно вкакие-то специальные атрибуты "data-*" все засунуть. Какие варианты еще попроще есть? Или в $this->registerJs() можно что-то передать, чтобы там это вставилось? Как грамотно сделать?
Осторожно! Вы общаетесь с новичком ;)
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

var $listMonth = <?= $list ?>;
Аватара пользователя
samdark
Администратор
Сообщения: 9489
Зарегистрирован: 2009.04.02, 13:46
Откуда: Воронеж
Контактная информация:

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение samdark »

Лучше всего в этом плане показали себя data-атрибуты, которые рендерятся в HTML.
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

samdark писал(а): 2017.03.18, 13:07 Лучше всего в этом плане показали себя data-атрибуты, которые рендерятся в HTML.
data-атрибуты - атрибуты данных html-элемента.
У ТС же справочник месяцев, не принадлежащий никакому элементу.
Аватара пользователя
girmate
Сообщения: 1534
Зарегистрирован: 2015.10.27, 12:52

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение girmate »

Месяцы я привел для примера. Мне нужно сделать селекты как здесь: ucp.php?i=165
Хочу повторить реализацию выбора временной зоны (смещения), а втором селекте - выбор конкретного часового пояса.
Вот и думаю, как лучше.
Осторожно! Вы общаетесь с новичком ;)
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

girmate писал(а): 2017.03.18, 15:25 Месяцы я привел для примера. Мне нужно сделать селекты как здесь: ucp.php?i=165
Хочу повторить реализацию выбора временной зоны (смещения), а втором селекте - выбор конкретного часового пояса.
Вот и думаю, как лучше.
это обычные селекты. здесь не нужен js
Аватара пользователя
girmate
Сообщения: 1534
Зарегистрирован: 2015.10.27, 12:52

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение girmate »

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

girmate писал(а): 2017.03.18, 11:05
Примечание: Использоваться будет в двух селектах. В одном выбираю параметр, во втором селекте - другие параметры, зависящие от первого. Для чего собираюсь сформировать кучу массивов, которые будут обходится для построения (и замены) списков, если изменяется первый селект.
Осторожно! Вы общаетесь с новичком ;)
Аватара пользователя
girmate
Сообщения: 1534
Зарегистрирован: 2015.10.27, 12:52

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение girmate »

Поправлюсь. Действительно, в эти селекты нужно передать все, что есть. А уже во фронтенде показать/скрывать те часовые пояса которые соответствуют первому селекту при JS.
Осторожно! Вы общаетесь с новичком ;)
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

а, ну ок. это все равно справочники. Хотя можно часовые пояса помещать в дата-атрибуты первого селекта, но слишком громоздко получится.
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

var timezoneList = <?= json_encode($timezones) ?>;
andrei.obuhovski
Сообщения: 610
Зарегистрирован: 2015.07.16, 10:50

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение andrei.obuhovski »

zelenin писал(а): 2017.03.18, 15:42 var timezoneList = <?= json_encode($timezones) ?>;
Не используйте такое без крайней необходимости. Это равносильно использованию global в php.

Для передачи данных из бэкенда на фронтенд существуют только 2 нормальных способа:
1) Как уже сказали выше, через data-атрибуты. А если эти данные нужны для нескольких элементов то добавить их к общему врапперу или создать фейковый элемент.
2) Сделать ajax-запрос для получения необходимых данных.
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

andrei.obuhovski писал(а): 2017.03.20, 09:39
zelenin писал(а): 2017.03.18, 15:42 var timezoneList = <?= json_encode($timezones) ?>;
Не используйте такое без крайней необходимости. Это равносильно использованию global в php.

Для передачи данных из бэкенда на фронтенд существуют только 2 нормальных способа:
1) Как уже сказали выше, через data-атрибуты. А если эти данные нужны для нескольких элементов то добавить их к общему врапперу или создать фейковый элемент.
2) Сделать ajax-запрос для получения необходимых данных.
это не так. выше я написал, что data-атрибуты - это атрибуты элемента, а timezoneList - это справочник, семантически не подходящий для data.
andrei.obuhovski
Сообщения: 610
Зарегистрирован: 2015.07.16, 10:50

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение andrei.obuhovski »

Как уже писал выше, можно данные добавить в общий враппер или создать скрытый элемент для этих данных.
Это гораздно лучше чем забивать глобальное пространсво js и смешивать php+js+html на одной странице.

Но, имхо, самый лучший вариант это сделать ajax-запрос на выборку этих данных. В популярных js-фреймворках (angular, react/redux) только так данные с бэкенда и передают.
Аватара пользователя
rugabarbo
Сообщения: 1063
Зарегистрирован: 2015.06.21, 16:21
Контактная информация:

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение rugabarbo »

andrei.obuhovski писал(а): 2017.03.20, 11:06 Как уже писал выше, можно данные добавить в общий враппер или создать скрытый элемент для этих данных.
Это гораздно лучше чем забивать глобальное пространсво js и смешивать php+js+html на одной странице.

Но, имхо, самый лучший вариант это сделать ajax-запрос на выборку этих данных. В популярных js-фреймворках (angular, react/redux) только так данные с бэкенда и передают.
популярно != разумно
Onotole
Сообщения: 1808
Зарегистрирован: 2012.12.24, 12:49

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение Onotole »

andrei.obuhovski писал(а): 2017.03.20, 11:06 В популярных js-фреймворках (angular, react/redux) только так данные с бэкенда и передают.
ИМХО это было бы уместно, если бы речь шла об одном из этих фреймворков
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

andrei.obuhovski писал(а): 2017.03.20, 11:06 Как уже писал выше, можно данные добавить в общий враппер или создать скрытый элемент для этих данных.
это неправильно, несемантично, неразумно.
andrei.obuhovski писал(а): 2017.03.20, 11:06Это гораздно лучше чем забивать глобальное пространсво js и смешивать php+js+html на одной странице.
var timezoneList = <?= json_encode($timezones) ?>;
vs
data-timezoneList="<?= json_encode($timezones) ?>"

а) одинаково
б) опять же в качестве довода (глобальное пространство) выбирается не принцип (data vs variable), а его частный кейс, предложенный мной. Конечно мы можем создать переменную без глобальной видимости.
andrei.obuhovski писал(а): 2017.03.20, 11:06Но, имхо, самый лучший вариант это сделать ajax-запрос на выборку этих данных. В популярных js-фреймворках (angular, react/redux) только так данные с бэкенда и передают.
парадигма другая. на js-фреймворках делают js-приложения, в которых кроме как из апи ничего не получить. А тут речь идет о js-улучшениях.
andrei.obuhovski
Сообщения: 610
Зарегистрирован: 2015.07.16, 10:50

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение andrei.obuhovski »

rugabarbo писал(а): 2017.03.20, 11:19 популярно != разумно
Вполне разумно.
1) Это уменьшит время загрузки документа.
2) Не придется забивать глобальное пространсво js. (Думаю не нужно объяснять что это может грозить конфликтами и утечками памяти)
3) На странице смешиваются только 2 языка (php+html), не 3 (php+html+js), и соответственно код становится более читаемый.
4) Данные можно передавать как есть. Не нужно костылить с экранированием.
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

andrei.obuhovski писал(а): 2017.03.20, 11:30
rugabarbo писал(а): 2017.03.20, 11:19 популярно != разумно
Вполне разумно.
1) Это уменьшит время загрузки документа.
уменьшит время загрузки документа, но увеличит время ожидания пользователем готовности формы.
andrei.obuhovski писал(а): 2017.03.20, 11:30 2) Не придется забивать глобальное пространсво js. (Думаю не нужно объяснять что это может грозить конфликтами и утечками памяти)
3) На странице смешиваются только 2 языка (php+html), не 3 (php+html+js), и соответственно код становится более читаемый.
4) Данные можно передавать как есть. Не нужно костылить с экранированием.
а на эти пункты отвечено комментом выше.
andrei.obuhovski
Сообщения: 610
Зарегистрирован: 2015.07.16, 10:50

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение andrei.obuhovski »

zelenin писал(а): 2017.03.20, 11:27 var timezoneList = <?= json_encode($timezones) ?>;
vs
data-timezoneList="<?= json_encode($timezones) ?>"

а) одинаково
б) опять же в качестве довода (глобальное пространство) выбирается не принцип (data vs variable), а его частный кейс, предложенный мной. Конечно мы можем создать переменную без глобальной видимости.
a) не одинаково. В первом варианте вы создаете переменную в js, а во втором аттрибут в DOM-елементе. И камелКейс в атрибутах не есть норм)
б) Если вы захотите создать переменную без глобальной области видимости, то вам придется оборачивать все в функцию (и переменную и логику), т.к. только функции в js создают область видимости. А это еще большее смешивание js+php+html.

Но, согласен, что дата-атрибуты для текущей задачи не очень красивое решение. Лучше будет подгрузить данные асинхронным запросом.
zelenin писал(а): 2017.03.20, 11:27 уменьшит время загрузки документа, но увеличит время ожидания пользователем готовности формы.
Не аргумент. Т.к. пользователи не бросаются сразу заполнять поля формы, а смотрят что вообще есть на странице.
zelenin
Сообщения: 10596
Зарегистрирован: 2013.04.20, 11:30

Re: Как сейчас принято передавать данные из PHP в JS?

Сообщение zelenin »

andrei.obuhovski писал(а): 2017.03.20, 12:01
zelenin писал(а): 2017.03.20, 11:27 var timezoneList = <?= json_encode($timezones) ?>;
vs
data-timezoneList="<?= json_encode($timezones) ?>"

а) одинаково
б) опять же в качестве довода (глобальное пространство) выбирается не принцип (data vs variable), а его частный кейс, предложенный мной. Конечно мы можем создать переменную без глобальной видимости.
a) не одинаково. В первом варианте вы создаете переменную в js, а во втором аттрибут в DOM-елементе.
я про смешивание языков
andrei.obuhovski писал(а): 2017.03.20, 12:01И камелКейс в атрибутах не есть норм)
а, ну вот это хороший довод. победил.
andrei.obuhovski писал(а): 2017.03.20, 12:01б) Если вы захотите создать переменную без глобальной области видимости, то вам придется оборачивать все в функцию (и переменную и логику), т.к. только функции в js создают область видимости. А это еще большее смешивание js+php+html.
главное варианты есть.

andrei.obuhovski писал(а): 2017.03.20, 12:01Но, согласен, что дата-атрибуты для текущей задачи не очень красивое решение. Лучше будет подгрузить данные асинхронным запросом.
оверинжиниринг
andrei.obuhovski писал(а): 2017.03.20, 12:01
zelenin писал(а): 2017.03.20, 11:27 уменьшит время загрузки документа, но увеличит время ожидания пользователем готовности формы.
Не аргумент. Т.к. пользователи не бросаются сразу заполнять поля формы, а смотрят что вообще есть на странице.
угу, поэтому они заметят загрузку лишнего килобайта текста, да?
Ответить