ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / ASP.NET [игнор отключен] [закрыт для гостей] / JSON to HTML - лучший способ?
25 сообщений из 51, страница 1 из 3
  1  все
JSON to HTML - лучший способ?
    #38455697
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
Есть JSON с маской и мачете постоянным набором ключей. Есть контейнер (допустим, условный div), который должен принять этот распарсенный JSON. JSON состоит из маски и мачете простых строчных данных, а также нескольких массивов. Размер массивов может меняться от запроса к запросу. Как лучше превратить JSON в HTML?

У меня есть два основных варианта. 1 - всё сделать на джаваскрипте (jQuery). 2 - сделать "скелет" из HTML с назначенными айдишниками и классами, а потом в этот HTML вставлять данные из JSON (наверное, методом findById/paste или чем-то в этом роде - что там у jQuery есть).

Проблема в том, что я в джаваскрипте и jQuery новичок, поэтому мне кажется, что вариант 1 будет для меня трудноватым. А второй вариант вроде как не предусматривает динамическое создание тегов с их атрибутами (всё уже есть в статике), а только считывание из JSON и вставку в нужный тег по айдишнику тега или как-то так.

Кто что посоветует? Если можно, приведите пример, пожалуйста, для первого варианта и для второго. Скажем, в первом варианте создаём такой-то тег, добавляем такие-то атрибуты, назначаем такие-то айди и класс, вставляем в тег такие-то данные из JSON. И для второго варианта тоже в этом же роде: ищем в HTML тег с таким-то айди и вставляем в него такие-то данные из JSON.
...
Рейтинг: 0 / 0
07.11.2013, 11:14
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455706
Фотография МСУ
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
МСУ
Участник
Нормальные люди для этого используют шаблоны. В качестве шаблонизатора можно выбрать, к примеру, xslt или razor.
...
Рейтинг: 0 / 0
07.11.2013, 11:17
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455712
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
МСУНормальные люди для этого используют шаблоны. В качестве шаблонизатора можно выбрать, к примеру, xslt или razor.
Эмм... Ну, я использую Razor по-умолчанию. Только как это поможет создать у клиента нужный кусок разметки? Это же серверная штука.

...А, я забыл сказать, что JSON приходит асинхронным запросом. Это же что-то меняет?
...
Рейтинг: 0 / 0
07.11.2013, 11:22
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455719
Фотография МСУ
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
МСУ
Участник
user7320Эмм... Ну, я использую Razor по-умолчанию. Только как это поможет создать у клиента нужный кусок разметки? Это же серверная штука.
Шаблон лежит на сервере в виде разор разметки, из js клиента ты его поднимаешь, передаешь параметры, и разором на сервере происходит маппинг. На клиенте ты пролучаешь готовый html.
...
Рейтинг: 0 / 0
07.11.2013, 11:25
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455722
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
раз уж зашел разговор про jQuery то под него и шаблонизатор есть (и кажись не один)
http://habrahabr.ru/post/112843/

и по-моему автор не тот форум выбрал для своего вопроса
...
Рейтинг: 0 / 0
07.11.2013, 11:25
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455724
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
2 сразу отказать. 1 не настолько сложно, как кажется. 3й вариант является комбинацией первых двух — тынц
...
Рейтинг: 0 / 0
07.11.2013, 11:26
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455726
Фотография МСУ
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
МСУ
Участник
Самый простой вариант, хранить шаблон на клиенте:

Код: html
1.
2.
3.
4.
5.
6.
<table id="template" style="display:none">
    <tr>
        <td></td>
        <td><a class='dynatree-title' href='#'></a></td>
    </tr>
</table>



И вручную его намапить:

Код: javascript
1.
2.
3.
4.
var template = $("#template").clone();
template.find("td:eq(0)").text(node.data.key);
template.find("td:eq(1) a").text(node.data.title);
var html = template.html();



Ну и отрисовать html в нужном месте.
...
Рейтинг: 0 / 0
07.11.2013, 11:29
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455769
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
Глубоко с jQuery хотелось бы разбираться в последнюю очередь, но советы по ним потом посмотрю, если другого ничего не выйдет.


МСУСамый простой вариант, хранить шаблон на клиенте:

Код: html
1.
2.
3.
4.
5.
6.
<table id="template" style="display:none">
    <tr>
        <td></td>
        <td><a class='dynatree-title' href='#'></a></td>
    </tr>
</table>



И вручную его намапить:

Код: javascript
1.
2.
3.
4.
var template = $("#template").clone();
template.find("td:eq(0)").text(node.data.key);
template.find("td:eq(1) a").text(node.data.title);
var html = template.html();



Ну и отрисовать html в нужном месте.
Шаблон - это и есть мой второй вариант, как я понял. А не могли бы вы дать ссылку на статью с подробным описанием этого действа c шаблонами, включая то, как отрисовать получившийся html в нужном месте?
...
Рейтинг: 0 / 0
07.11.2013, 11:46
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455781
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
Чтобы ясно стало, я сценарий полностью проговорю. Есть страница со ссылками. Кликаешь на ссылку - идёт ajax на сервер, который возвращает json с описанием объекта. Описание должно появиться справа от ссылок. Вроде, всё стандартно.
...
Рейтинг: 0 / 0
07.11.2013, 11:50
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455783
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
Если хранить шаблон на сервере, то придётся вставлять его как raw на клиенте, как я понимаю. А это не совсем гуд с точки зрения безопасности.
...
Рейтинг: 0 / 0
07.11.2013, 11:51
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455790
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
user7320Чтобы ясно стало, я сценарий полностью проговорю. Есть страница со ссылками. Кликаешь на ссылку - идёт ajax на сервер, который возвращает json с описанием объекта. Описание должно появиться справа от ссылок. Вроде, всё стандартно.вот если бы при клике на ссылке происходил переход по этой ссылке, тогда было бы стандартно
...
Рейтинг: 0 / 0
07.11.2013, 11:52
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455848
Фотография hVostt
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
hVostt
Участник
user7320Чтобы ясно стало, я сценарий полностью проговорю. Есть страница со ссылками. Кликаешь на ссылку - идёт ajax на сервер, который возвращает json с описанием объекта. Описание должно появиться справа от ссылок. Вроде, всё стандартно.

knockout.js
...
Рейтинг: 0 / 0
07.11.2013, 12:25
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455875
Boneshock
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Boneshock
Участник
МСУИ вручную его намапить:

Код: javascript
1.
2.
3.
4.
var template = $("#template").clone();
template.find("td:eq(0)").text(node.data.key);
template.find("td:eq(1) a").text(node.data.title);
var html = template.html();



Ну и отрисовать html в нужном месте.

МСУ, нафига, если есть jquery templates(о чем писал выше Паганель)

плюсую за них
...
Рейтинг: 0 / 0
07.11.2013, 12:36
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455899
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
При чём жКвери и JSON?
JSON прекрасно преобразуется (или даже является, смотря как передать на страницу) структурированым объектом javascript.
Какое нафиг жквери? Чистый яваскрипт.
...
Рейтинг: 0 / 0
07.11.2013, 12:46
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455929
Фотография МСУ
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
МСУ
Участник
BoneshockМСУ, нафига, если есть jquery templates(о чем писал выше Паганель)
плюсую за них
Я вообще за серверный шаблонизатор razor, а не за клиентский. Он рулит. Шаблон на сервере, нормальная модель представления и всё такое.
...
Рейтинг: 0 / 0
07.11.2013, 12:59
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455933
Boneshock
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Boneshock
Участник
ShSergeПри чём жКвери и JSON?
JSON прекрасно преобразуется (или даже является, смотря как передать на страницу) структурированым объектом javascript.
Какое нафиг жквери? Чистый яваскрипт.

дада, мы помним, CGI и Vanilla javascript, спасибо
...
Рейтинг: 0 / 0
07.11.2013, 13:02
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455936
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
Паганельuser7320Чтобы ясно стало, я сценарий полностью проговорю. Есть страница со ссылками. Кликаешь на ссылку - идёт ajax на сервер, который возвращает json с описанием объекта. Описание должно появиться справа от ссылок. Вроде, всё стандартно.вот если бы при клике на ссылке происходил переход по этой ссылке, тогда было бы стандартно
А зачем переход? Ссылки - это на самом деле дерево ссылок. Переход - это полностью новая сгенеренная на сервере страница, включая это дерево. Не лучше ли только кусочек со статьёй обновить асинхронно? Тем более, что с деревом придётся возиться - запоминать, какие узлы были открыты, какие закрыты, какой узел был выбран.

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


BoneshockМСУИ вручную его намапить:

Код: javascript
1.
2.
3.
4.
var template = $("#template").clone();
template.find("td:eq(0)").text(node.data.key);
template.find("td:eq(1) a").text(node.data.title);
var html = template.html();



Ну и отрисовать html в нужном месте.

МСУ, нафига, если есть jquery templates(о чем писал выше Паганель)

плюсую за них
Это?


ShSergeПри чём жКвери и JSON?
JSON прекрасно преобразуется (или даже является, смотря как передать на страницу) структурированым объектом javascript.
Какое нафиг жквери? Чистый яваскрипт.
Приведите пример, пожалуйста.
...
Рейтинг: 0 / 0
07.11.2013, 13:03
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455952
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
user7320...Приведите пример, пожалуйста.
Не приведу. Не хочу. Сами по форуму ищите.
Я плакаю.
...
Рейтинг: 0 / 0
07.11.2013, 13:08
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455956
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
BoneshockShSergeПри чём жКвери и JSON?
JSON прекрасно преобразуется (или даже является, смотря как передать на страницу) структурированым объектом javascript.
Какое нафиг жквери? Чистый яваскрипт.

дада, мы помним, CGI и Vanilla javascript, спасибо
А что такое "Vanilla"?
...
Рейтинг: 0 / 0
07.11.2013, 13:10
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455959
Фотография hVostt
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
hVostt
Участник
ShSergeА что такое "Vanilla"?
...
Рейтинг: 0 / 0
07.11.2013, 13:12
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455976
Фотография hVostt
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
hVostt
Участник
user7320,

ещё раз. knockout.js идёт в комплекте стандартного шаблона MVC 4

повторить? там и темлейты есть, и биндинг JSON модели полученной по AJAX. в общем всё есть. в коробке. подключи всего 1 js файл, и не парь себе и людям голову

туториалы на сайте разберётся с ними ребёнок за пол часа.
...
Рейтинг: 0 / 0
07.11.2013, 13:15
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455977
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
hVosttShSergeА что такое "Vanilla"?


Чё ржошь? Все знают, а я - нихрена не знаю. :)
...
Рейтинг: 0 / 0
07.11.2013, 13:15
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455979
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
handlebarsjs.com
...
Рейтинг: 0 / 0
07.11.2013, 13:16
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455984
user7320
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user7320
Участник
МСУBoneshockМСУ, нафига, если есть jquery templates(о чем писал выше Паганель)
плюсую за них
Я вообще за серверный шаблонизатор razor, а не за клиентский. Он рулит. Шаблон на сервере, нормальная модель представления и всё такое.
Я никак не могу понять, про какие шаблоны вы говорите? Вот мой код представления. Там менюшка слева и место для статьи о товаре справа. Скриптик, который асинхронно запрашивает статью о товаре и начатки "шаблона статьи". В скрипт я пока поставил заглушку в виде алерта.

 
Код: c#
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.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
@model IList<TreeViewNodeModel>
@{
    ViewBag.Title = "Товары";
}

<div class="leftMenuContainer">
    <h2>Список товаров по группам</h2>
    <ul id="groupTree">
        @CustomHTMLHelpers.TreeView(Model)
    </ul>
</div>

<div class="centralContainer">
    <h2>Товар</h2>
</div>

<script type="text/javascript">
    $(document).ready(function ()
    {
        $('#groupTree').treeview({ collapsed: true });

        $(".treeViewLeaf.goods-tree-view-node").click(function ()
        {
            $.ajax(
                {
                    url: "@Url.Action("Goods", "GoodsClassification")",
                    data: { goodsId: $(this).attr("id") },
                    type: "GET",
                    success: function (data)
                    {
                        alert(data.Name);
                    }
                });
        });
    });
</script>

@* Шаблон статьи. *@
<div id="goodsArticleTemplate" style="display: none">
    <div id="mainCharacteristic">
        <h1>
            Основная характеристика
        </h1>
        <p class="goodsPropertyCaption">
            Название товара
        </p>
        <p class="goodsPropertyValue">
						Бла-бла...
        </p>
    </div>
</div>

...
Рейтинг: 0 / 0
07.11.2013, 13:17
| Ответить | Цитировать | Написать  
JSON to HTML - лучший способ?
    #38455987
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
hVosttShSergeА что такое "Vanilla"?


Чё ржошь? Все знают, а я - нихрена не знаю. :)
...
Рейтинг: 0 / 0
07.11.2013, 13:17
| Ответить | Цитировать | Написать  
25 сообщений из 51, страница 1 из 3
  1  все
Форумы / ASP.NET [игнор отключен] [закрыт для гостей] / JSON to HTML - лучший способ?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]