Лучший способ передать данные с PHP на JavaScript для моего конкретного случая

Question

Я создал онлайн-сообщество в Drupal с домашней страницей, которая похожа на стену Facebook. Вы видите 25 последних сообщений с двумя последними комментариями ниже этих сообщений. Существует также текстовое поле прямо под этими комментариями, чтобы вы могли быстро опубликовать новый комментарий к определенному сообщению.

Эти сообщения в стиле Facebook имеют множество функций, встроенных в них через JavaScript. Нажав ссылку «просмотреть все комментарии» непосредственно под сообщением, вы получаете вызов AJAX, который захватывает все комментарии для этого сообщения и отображает их прямо под ним. Вы также можете отметить сообщения как полезные, как решение вашего вопроса, отредактировать встроенные комментарии и т. Д. Все эти действия требуют запросов AJAX, а это значит, что JavaScript, выполняющий запрос, должен знать важную информацию, такую ​​как идентификатор узла (уникальный идентификатор идентификатор сообщения), идентификатор комментария (уникальный идентификатор комментария) и т. д.

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

Итак, теперь у меня есть третья идея, и я ищу для нее обратную связь до внедрения. Идея состоит в том, чтобы создать единый глобальный массив JS для всех этих сообщений, который содержит внутри него объекты, которые хранят данные для каждого сообщения. Каждый элемент в этом массиве будет содержать необходимые данные, необходимые для вызовов AJAX. Так это будет выглядеть примерно так:

Facebook стиле пост шаблон

<div class="post" data-postindex="<?php echo $post->index; ?>"> 
    <!-- lots of other HTML for the post --> 
</div> 
<script type="text/javascript"> 
    globalPostArray.push({ 
     nid: <?php echo $post->nid; ?>, 
     authorID: <?php $post->authorID; ?>, 
     //etc. etc. etc. 
    }); 
</script> 

В результате приведенного выше кода является то, что, когда ссылка получает щелкнул, которая требует запроса AJAX, то JS просто пересечь DOM вверх от этой ссылки, пока не найдет основной элемент .post. Затем он захватит значение data-postindex, чтобы узнать, какой элемент в globalPostArray содержит данные, которые ему нужны.

Мысли? Я чувствую, что должен быть какой-то стандартный, принятый способ сделать что-то подобное.

Answer 1

Я никогда не слышал о стандартном способе «передавать» информацию между PHP и Javascript, так как они являются серверным и клиентским языком, соответственно. Я лично использовал бы гибрид ваших вторых и третьих решений.

Сохраните идентификатор сообщения в атрибуте data-postindex (атрибуты данных являются новыми, а «правильный» способ хранить небольшие объемы данных). Но я все равно просто использовал бы массив JSON для остальных, так как хранение большого количества данных в атрибутах данных (и их экранирование!) Потенциально проблематично. PHP имеет json_encode функцию, которая берет на себя все отводящей и такие для вас - просто построить PHP массив (скажем, $postdata), как обычно, а затем бросить это в вашем почтовом шаблоне:

<script type="text/javascript"> 
    globalPostArray.push(<?php echo json_encode($postdata) ?>); 
</script> 

Где $postdata это что-то вроде следующего:

$postdata = array(
    'nid' => 5, 
    'authorId' => 45 
    ...etc... 
); 

Должно быть достаточно легко создать такой массив из существующего кода.

Я написал blog post некоторое время назад о моей реализации такого рода вещей, но, похоже, все, что вам нужно, это указатель на json_encode.

Answer 2

Я бы хранить данные внутри элемента:

<div class="post" data-postindex="<?php echo $post->index; ?>" 
        data-nid="<?php echo $post->nid; ?>" 
        data-authorID="<?php echo $post->authorID; ?>"> 

... или хранить полный JSON-строку в 1-данных атрибута:

<div data-data="<?php echo htmlentities(json_encode($somedata));?>"> 

Answer 3

Самый надежный способ передать любой Переменная PHP для JavaScript - json_encode.

<script type="text/javascript"> 
    var something = <?php echo json_encode($var); ?>; 
</script> 

Вы не можете пройти мимо укрытий и ресурсов, но в остальном игра ничего не проходит.

Answer 4

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

somefile.html

<html> 
    <head>..</head> 
    <body> 
     html code 
     <script> 
      window.my_data = <?php echo json_encode($my_php_var); ?> 
     </script> 
    </body> 
    </html> 

somefile.js

 $(function() { 
      window.myitem = new myClass(window.my_data); 
     }); 
     var MyClass = function(init_data) {...}