JSON из PHP в JavaScript - PullRequest
       4

JSON из PHP в JavaScript

1 голос
/ 22 июня 2011

Немного другой вопрос, что все другие там ... Я могу легко передать JSON со страницы PHP в JavaScript, используя jQuery.ajax() метод, но вот моя ситуация:

У меня есть набор контактных данных в MySQL, каждый с именем, фамилией, лат, lng.Я создал страницу, которая на половине отображает контактные данные (имя, фамилия) в табличном формате.С другой стороны, у меня есть карта Google, которая заполнена маркерами из набора данных (lat, lng).Теперь, чтобы позволить двум половинкам совместно использовать один и тот же набор данных, есть два метода, но я доволен ни одним из них:

  1. В файле PHP извлеките данные из MySQL, используйте эти данныеустановите для таблицы, затем преобразуйте эти данные в JSON, запишите их в переменную JavaScript и используйте эту переменную для заполнения карты Google.Не нравится это делать, поскольку существуют сотни точек данных, что означает, что строка JSON очень велика и раздувает страницу, а также содержит все данные в удобочитаемой для человека форме в источнике (я понимаю, что данные есть, несмотря ни на чтокак и во всех случаях, это на стороне клиента, здесь это более очевидно).

  2. В файле PHP извлеките данные из MySQL, используйте этот набор данных для таблицы, затем вМой JavaScript, сделайте AJAX-вызов через jQuery.ajax() в другой файл PHP, который генерирует данные JSON.Ненавижу это, так как это приводит к двум вызовам к одному и тому же источнику данных.

Я уверен, что мне не хватает чего-то очевидного здесь, какие-либо указатели / справки?

РЕДАКТИРОВАТЬ: По опции# 1 выше, я хорошо знаю, как выводить JSON из PHP в JavaScript ... просто недоволен обоими решениями (то есть JSON находится в источнике, или JSON фактически является вторым вызовом источника данных).

Ответы [ 5 ]

1 голос
/ 22 июня 2011

Ваши требования противоречат друг другу:

  • ваши данные представлены в виде, удобном для восприятия человеком, в таблице, но вы не хотите отправлять их через JSON, потому что они "читаются человеком.form [...] "

  • таблица огромна, со всеми tds, trs, и все же вы не против отправить те же данные через JSON (вероятно, потребуется меньше места).

Тем не менее, если вы ДЕЙСТВИТЕЛЬНО возражаете против JSON и не обращаете внимания на таблицу, вы можете извлечь данные из таблицы (которую вы отправляете в любом случае).Довольно глупо, но здесь идет речь:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<table id='test'>
    <tr>
        <td>John</td><td>Smith</td>
        <td>354.3</td><td>52.5</td>
    </tr>
    <tr>
        <td>Adam</td><td>Dreger</td>
        <td>12.3</td><td>  52      </td>
    </tr>
    <tr>
        <td>Filip</td><td>Smith</td>
        <td>354.3</td><td>7.5</td>
    </tr>
</table>
<script>
    var data = $("#test tr").map(function(){
        return [$("td", this).map(function(){
            return this.innerHTML.match(/^\s*\d+(.\d+)?\s*$/)? 
                parseFloat(this.innerHTML) : this.innerHTML;
        }).toArray()]
    })
</script>

Это известный шаблон модели контроллера представления, в котором контроллер запрашивает представление для сбора данных, которые будут использоваться в качестве модели; -)

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

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

<div id='another'>
 - - -
</div>
<script>
    // I assume that data is an array of arrays
    $('#another').html(
        [
        '<table border="1">',
        $(data).map(function(){
            return ['<tr>',
            $(this).map(function(){return "<td>" + this + "</td>"}).toArray().join("")
            ,'</tr>']
        }).toArray().join(""),
        '</table>'
        ].join("")
    );

</script>

(примечание: два приведенных выше фрагмента могут быть объединены в цепочку и привести к дублированию первой таблицы: весело!)

РЕДАКТИРОВАТЬ:

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

    <style>.secret {display: none}</style>

    <tr>
        <td>Adam</td><td>Dreger</td>
        <td>12.3</td><td>  52  </td>
            <td><span class='secret'>({frperg:"ovt bar"})</span></td>
    </tr>

И в коде:

<script>
    var data = $("#test tr").map(function(){
        return [$("td", this).map(function(){
            return this.innerHTML.match(/^\s*\d+(.\d+)?\s*$/)? 
                parseFloat(this.innerHTML) : this.innerHTML;
        }).toArray(), 

            eval($(".secret", this).html().rot13())]
    })
</script>
1 голос
/ 22 июня 2011

Лучше всего было бы включить кэширование на вашем сервере MySQL и сделать два одинаковых вызова:

http://www.petefreitag.com/item/390.cfm

Вы не можете поместить данные в двух разных местах без a)сделать два обращения к базе данных или b) сохранить результаты в файле .txt (или аналогичном) и извлечь его через ajax.

Я полагаю, что вы могли бы сделать б), но это выглядит немного неаккуратно и, вероятно, создаст больше накладных расходов, чем просто вызовы 2 БД.

0 голосов
/ 22 июня 2011

Я бы использовал вариант № 2. Да, загрузите JSON через AJAX, так как это ускорит загрузку страницы и будет более гибким - возможно, в какой-то момент в будущем вы захотите отобразить карту без таблицы или чего-то подобного.

Но добавьте PHP класс , который оборачивает вызов к источнику данных и используется как страницей, которая генерирует HTML, так и страницей, которая генерирует JSON. Это облегчит кеширование результатов запроса и исключит дублирование кода.

0 голосов
/ 22 июня 2011

Это зависит от размера набора данных.Если это большая полезная нагрузка, вы можете использовать ее как внешний файл (например, сделать ajax-запрос), чтобы браузер кешировал его.Однако в большинстве случаев минимизируйте количество HTTP-запросов в максимально возможной степени.Лично я бы пошел с встраиванием JSON в HTML, если это не может быть> 20 КБ в архиве.

0 голосов
/ 22 июня 2011

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

<?php
$arr = array('a' => 1, 'b' => 2, 'c' => 3, 'd' => 4, 'e' => 5);

echo json_encode($arr);
?>

Это так просто, распечатать вывод и пройти его, как любой другой объект Javascript на стороне клиента;)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...