Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Разработка веб приложения (https://javascript.ru/forum/misc/15082-razrabotka-veb-prilozheniya.html)

JSTalker 12.02.2011 17:10

Разработка веб приложения
 
Современного. Первый опыт)

Здрасте!
Решил не плодить много тем, поскольку вопросы мелкие и по одной теме будут..

Это не попытка перекласть разработку на форумчан, а просто поиск решения, и спобов реализации. Поэтому просьба отнестись с пониманием)

Короче задача:
Разрабатываю веб-приложение - редактор рекламных блоков.
Вкратце задание:
Цитата:

На основной странице приложения располагаются: 1. поле (textarea) для ввода данных в json-формате, на основе которых будут сформированы блоки 2. кнопка (либо ссылка), открывающая три окна, позволяющих работать с блоками: таблица с блоками, форма редактирования блока, вид блока (с возможностью изменения высоты, ширины и позиции) 3. кнопка (либо ссылка), по клику на которую в поле ввода данных загружаются изменённые данные в json-формате Формат ввода и вывода объявлений: * { “title” : “Google.com”, “x” : 10, “y” : 15, “width” : 200, “height” : 100, “color” : “#FFFFFF”, “image” :“http://www.ru-iphone.com/files/img_1...le_logo.jpg”, “text” : “Лучший поисковик всех времён и народов” }, … ]
Тезис: Использую в проекте парадигму ненавязчивого программирования, но столкнулся с проблемой.
Вопрос: А как, собственно, правильно ее использовать? Код динамич. у меня не работает.

Вот хтмл
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"/>
        <title>Main Page</title>
        <link rel="stylesheet" type="text/css" href="CSS/main.css">
        <script type="application/javascript" src="JS/main.js">
        </script>
		<script type='application/javascript' src="JS/json/json2.js"></script>
    </head>
    <body>
        <div class="divs" contenteditable="true" id="div1">
            <textarea class="textareas" id="ta1">
            </textarea>
        </div>
        <button class="buttons" id="b1" value="Why not?">
            Edit AdBlock
        </button>
        <button class="buttons" id="b2" value="Value?">
            Load JSON
        </button>
    </body>
</html>


main.js

/**
 * @author 
 */

/*Textarea HTMLElement Finding*/
var txtArea = document.getElementById('ta1');

var btnEditAB = document.getElementById('b1');
var btnJSON = document.getElementById('b2');


/*probably JSON code of AdBlock*/
var ta_content = txtArea.innerText;

/*JSON-or-not checking */
function isJSON(string_code){
	
}
//code

//Edit-button press handler
/*
btnEditAB.onclick = function (ta_content){
	if(ta_content) 
	alert(JSON.parse(ta_content));
}
*/

/*
btnEditAB.onclick = function (){
 
	alert('You press button!');
}


*/

if (ta1) alert("TextArea finded!");

Соответственно ничего не выводится. Курю (повторно) Флэнегана..:blink:

NoResponse 12.02.2011 18:22

...скрипты отрабатывают раньше чем появляется body со всем содержимым

JSTalker 12.02.2011 19:10

NoResponse,
А! То есть onload надо запускать? Тогда функцию надо создавать чтоли?

dmitriymar 12.02.2011 19:20

разбей свой main.js на функции и или через онлоад запусти.или или перед закрытием боди(1 вариант лучше).или в конец боди вынеси всё кроме функций,что должны быть обработчиками событий

JSTalker 14.02.2011 07:36

Спасибо, разобрался.(вставил "объемлющую" функцию).

Следующий вопрос:
Как убедиться, что textarea пустая(В нее ничего не введено)?
Такой скрипт
/*probably JSON code of AdBlock*/
	var ta_content = txtArea.innerText;
	
	 btnEditAB.onclick = function (ta_content){
	 
if(ta_content!=="")
	 /*alert(JSON.parse(ta_content));
*/alert('Edit!');


не помогает.. Выводит "Edit!" даже если пусто в поле ввода...

Просто if (ta_content) и с != тоже пробовал. Все одно..

JSTalker 14.02.2011 09:27

Смотрю
http://javascript.ru/forum/misc/3926...e-li-pole.html
тут через регулярные выражения реализовано. А нельзя ли как то по землянски?

ksa 14.02.2011 11:42

Цитата:

Сообщение от JSTalker
А нельзя ли как то по землянски?

Смый примитив...
if (document.getElementById('txt').value=='') {
   alert('Поле пустое')
}

JSTalker 15.02.2011 14:37

Спасибо, уже проверил по длине :)
btnEditAB.onclick = function(ta_content){
    
        if (document.getElementById('ta1').value.replace(/\s+/g, '').length) 
            /*alert(JSON.parse(ta_content));*/
/*
            alert('TextArea is not empty!!');
*/
//				alert('JSON!');
// Parsing JSON from TextArea field and checking it for AdBlock structure
			try {

				var json_tav = JSON.parse(ta_content);
				//alert(json_tav["title"]);
				if (json_tav) alert('Its Ok!');
			}
			catch(SyntaxError){
				alert('Its not AdBlock JSON-code!')
	}
    }

А кто знает как работать с распарсенными JSON-объектами? Попытался вывести через алерт, проверенный здесь JSON-объект из задания:
Цитата:

[{ "title" : "Google.com", "x" : 10, "y" : 15, "width" : 200, "height" : 100, "color" : "#FFFFFF", "image" :"http://www.ru-iphone.com/files/img_1032_google_logo.jpg", "text" : "Лучший поисковик всех времён и народов" }]
Не выводится. Попытался вывести одно из его свойств алертом: и как свойство объекта, и как элемент ассоциативного массива. Все равно выдает исключение (Its not AdBlock JSON-code!').

Поэтому вопрос, как работать с JSON объектами после того как их распарсил? И... правильно ли я парсю?

x-yuri 15.02.2011 22:58

для начала, а почему пользователь вводит данные в JSON-формате?

Цитата:

Сообщение от JSTalker
Тезис: Использую в проекте парадигму ненавязчивого программирования, но столкнулся с проблемой.
Вопрос: А как, собственно, правильно ее использовать?

если используешь, у пользователя должна быть возможность работать с отключенным javascript


Часовой пояс GMT +3, время: 14:32.