VPF::jquery + json генерация кнопок с условием отображе

Efes

Дата 17.11.2012, 13:18 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 10
Регистрация: 24.10.2012

Репутация: нет
Всего: нет

Привет всем!

Пытаюсь сгенерировать кнопки, условия отображения которых описаны в json. Подскажите, как сделать.

Вот мой код json:

Цитата

{
    "Caption": "Module caption",
    "IconsDirectory": "C://Images/",
    "Buttons": [
        {
            "Conditions": [
                {
                    "ConditionText": "1 == 1",
                    "ButtonText": "Text1",
                    "Visible": true,
                    "Colors": {
                        "FontColor": "#FFFFFF",
                        "BGColor": "#00FF00"
                    },
                    "Size": {
                        "Width": 200,
                        "Height": 50
                    },
                    "Icon": {
                        "FileName": "Smile.png",
                        "Width": 16,
                        "Height": 16
                    },
                    "Url": {
                        "UrlAddress": "http://www.google.com",
                        "OpenNewWindow": true
                    },
                    "JavaScriptAction": {
                        "Text": "alert('ok');"
                    }
                },
                {
                    "ConditionText": "2 == 2",
                    "ButtonText": "Text2",
                    "Visible": true,
                    "Colors": {
                        "FontColor": "#FFFFFF",
                        "BGColor": "#00FF00"
                    },
                    "Size": {
                        "Width": 200,
                        "Height": 50
                    },
                    "Icon": {
                        "FileName": "Smile.png",
                        "Width": 16,
                        "Height": 16
                    },
                    "Url": {
                        "UrlAddress": "http://www.google.com",
                        "OpenNewWindow": true
                    },
                    "JavaScriptAction": {
                        "Text": "alert('ok');"
                    }
                }
            ]
        }
    ]
}

код html:

Цитата

<html>
<head>
<title>SMButtons</title>
<script src="jquery/jquery-1.4.2.js"></script>
<script type="text/javascript">
//When document loaded.
$(document).ready(function(){
// Get data from file as JSON
            $.getJSON('weekendtask.json', function(data) {
        var buttons = data.Buttons;
           $.each(buttons, function(key, val)
           {
                    $('<li><input type="button" onClick="'+ val.JavaScriptAction +'" value="'+ val.ButtonText +'"/></li>').appendTo('#ulObj');
           });
   });
   });
   </script>
</head>
<body>
<br>
<br>
<div>
<ul id='ulObj'>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</body>
</html>

Sanchezzz

Дата 17.11.2012, 15:58 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1670
Регистрация: 19.11.2006
Где: Voronezh

Репутация: 3
Всего: 60

Вы неверно прочитали структуру из JSON
Вот тест http://jsfiddle.net/eCgDv/2/ выводит 2 кнопки.

f12 в хроме помогут вам понять что выводится в цикле.
console.log( key )

Это сообщение отредактировал(а) Sanchezzz - 17.11.2012, 15:59

--------------------

Понравился ответ "+" по репе, не забываем закрывать тему, заказы в LS.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »