Выбор дива из данных полученных через AJAX. - JavaScript, Ajax

MarkStaver · 14.01.2011, 01:57

Попытаюсь объяснить необходимое:
Есть сложный интерфейс: скорее меню навигации по сайту выполненное как контейнер для содержимого. Само же содержимое подгружается с помощью AJAX в отдельный див, но есть тривиальная проблема.
1) Страница это html файл, чистый интерфейс без ничего.
2) Остальное грузится с пхп, но скрипты выдают лишь котент див.
Т.Е. при переходе с внешних ссылок, пользователь увидит текст без оформления с сомнительным содержанием

,
3) Теперь представим что я темплейтом подключил интерфейс к скриптам, получается, что пользователь будет видеть стартовое положение, независимо на какую страниц он попал, хуже в див аяском будет грузится та-же страница но уже с содержанием....
Вот тут я и захотел выбрать один див, из аякс ответа, со всем содержимым собственно тот самый контент див. И поставить его на нужное место.
Но мозги потерялись в вариантах, jquery использовать не хочу, весит в 3 раза больше чем надо, и, что теперь вбивать в гугл не имею представления, все, что мог придумать испробовал инфы не нашел....

Собственно все что надо это достать один див из ответа аякс, или объяснить пхп что вернуть надо контент если к нему скрипт обращается....
Пока смотрю на варианты двух темплейтов...

PHP код:


			
function showContent(link) {

        var cont = document.getElementById('contentBody');
        var loading = document.getElementById('loading');

        cont.innerHTML = loading.innerHTML;

        var http = createRequestObject();    
        if( http ) {
            http.open('get', link);
            http.onreadystatechange = function () {    
                if(http.readyState == 4) {
                    cont.innerHTML = http.responseText; // Вот тут думаю и должна быть функция фильтрации данных
                }
            }
            http.send(null);    
        } else {
            document.location = link;
        }
    }
    function createRequestObject() {
        try { return new XMLHttpRequest() }
        catch(e) {
            try { return new ActiveXObject('Msxml2.XMLHTTP') }
            catch(e) {
                try { return new ActiveXObject('Microsoft.XMLHTTP') }
                catch(e) { return null; }
            }
        }
    }

13th · 14.01.2011, 02:19

чувак , всё очень просто.
есть такое понятие в джавасркипте как хеш, а именно location.hash и содержить оно якоря. открой translate.google.com. увидишь как там сделаны закладки из хеша.
итог ты мастеришь хеш адреса старниц(они и историю для браузера сделают) и при событие onload на объекте окна отправляешь нужный запрос на свои скрипты, которые корректириуют твой начальный контент.

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

MarkStaver · 14.01.2011, 02:35

Походу пол третьего надо всеже спать

))) в принципе понял но это повлекло еще миллиард вопросов

которые просто порвали и без того воспаленный мозг

есть пример кода кроме гугла? в нем покапаюсь завтра сегодня такую жирную пищу не осилю

))))))

yury_coder · 14.01.2011, 13:28

http.responseText абсолютно не обязательно сразу же выводить куда-либо.

Более того, в этом php совершенно не обязательно должна быть валидная страница html. Там может быть только тот див, который тебя сейчас интересует, а то, какой именно сейчас нужен можно передавать в качестве параметра GET

Насчёт хеша, верно, его очень удобно испрользовать для навигации.

Пример:

Клиентская часть:

Код HTML:

<html>
<head>
<script type="text/javascript">
//Здесь вполне подойдёт Ваш код
//Писать не буду
//ах да, добавьте ещё один параметр в ф-цию ShowContent, которая обзначит нужный вам див
//Например, назовём её page
//Тогда ссылка будет: link + '?page='+page
</script>
</head>
<body>
<!--Конечно, полностью верстать не буду-->
<div id="navigation">
<div onclick="ShowContent('server.php', 'index')">Главная</div>
<div onclick="ShowContent('server.php', 'page1')">Страница 1</div>
<div onclick="ShowContent('server.php', 'page2')">Страница 2</div>
</div>
<div id="contentBody" />
</body>
</html>

На серверной части, файл server.php:

PHP код:


			
switch($_GET['page'])

{

case "index":

  echo "Это главная страница";

  break;

case "page1":

  echo "Страница 1";

  break;

case "page2";

  echo "Страница 2";

  break;

default:

  echo "404";

}

13th · 14.01.2011, 16:31

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

только вот еще что скажу, можно так грамотно прописать правила mod_rewrite что хеши будут идти как идентификаторы страниц и если не будет включен джаваскрипт у пользователя, то он сможет все равно видит разные страницы, в зависимости от хеша, отданные серверным скриптом.

костяк у тебя есть - разбирайся. зайди на джиквери api.jquery.com - метод ajax

14.01.2011, 01:57	#1
MarkStaver Регистрация: 22.01.2010 Сообщений: 9	Выбор дива из данных полученных через AJAX. Попытаюсь объяснить необходимое: Есть сложный интерфейс: скорее меню навигации по сайту выполненное как контейнер для содержимого. Само же содержимое подгружается с помощью AJAX в отдельный див, но есть тривиальная проблема. 1) Страница это html файл, чистый интерфейс без ничего. 2) Остальное грузится с пхп, но скрипты выдают лишь котент див. Т.Е. при переходе с внешних ссылок, пользователь увидит текст без оформления с сомнительным содержанием , 3) Теперь представим что я темплейтом подключил интерфейс к скриптам, получается, что пользователь будет видеть стартовое положение, независимо на какую страниц он попал, хуже в див аяском будет грузится та-же страница но уже с содержанием.... Вот тут я и захотел выбрать один див, из аякс ответа, со всем содержимым собственно тот самый контент див. И поставить его на нужное место. Но мозги потерялись в вариантах, jquery использовать не хочу, весит в 3 раза больше чем надо, и, что теперь вбивать в гугл не имею представления, все, что мог придумать испробовал инфы не нашел.... Собственно все что надо это достать один див из ответа аякс, или объяснить пхп что вернуть надо контент если к нему скрипт обращается.... Пока смотрю на варианты двух темплейтов... PHP код: function showContent(link) { var cont = document.getElementById('contentBody'); var loading = document.getElementById('loading'); cont.innerHTML = loading.innerHTML; var http = createRequestObject(); if( http ) { http.open('get', link); http.onreadystatechange = function () { if(http.readyState == 4) { cont.innerHTML = http.responseText; // Вот тут думаю и должна быть функция фильтрации данных } } http.send(null); } else { document.location = link; } } function createRequestObject() { try { return new XMLHttpRequest() } catch(e) { try { return new ActiveXObject('Msxml2.XMLHTTP') } catch(e) { try { return new ActiveXObject('Microsoft.XMLHTTP') } catch(e) { return null; } } } } Последний раз редактировалось MarkStaver; 14.01.2011 в 02:01.

14.01.2011, 02:19	#2
13th Форумчанин Регистрация: 31.12.2008 Сообщений: 634	чувак , всё очень просто. есть такое понятие в джавасркипте как хеш, а именно location.hash и содержить оно якоря. открой translate.google.com. увидишь как там сделаны закладки из хеша. итог ты мастеришь хеш адреса старниц(они и историю для браузера сделают) и при событие onload на объекте окна отправляешь нужный запрос на свои скрипты, которые корректириуют твой начальный контент. теперь советы , которых ты не спрашивал. - исопльзуй джиквери. - там есть мега крутые решение запиливания и распиливания данных с сервера и обратно (практически как хоббит!!!). - если весь твой веб серивси/сайт работает только на аяксе или динамическом изменение контента, то для поисковика - ты пустая старница. единственное что чуть изменит ситуция с якорями - ты станешь не пустой страницей , а страницей с контентом Возможно всё Пишу обо всем

14.01.2011, 13:28	#4
yury_coder Пользователь Регистрация: 31.10.2010 Сообщений: 53	http.responseText абсолютно не обязательно сразу же выводить куда-либо. Более того, в этом php совершенно не обязательно должна быть валидная страница html. Там может быть только тот див, который тебя сейчас интересует, а то, какой именно сейчас нужен можно передавать в качестве параметра GET Насчёт хеша, верно, его очень удобно испрользовать для навигации. Пример: Клиентская часть: Код HTML: <html> <head> <script type="text/javascript"> //Здесь вполне подойдёт Ваш код //Писать не буду //ах да, добавьте ещё один параметр в ф-цию ShowContent, которая обзначит нужный вам див //Например, назовём её page //Тогда ссылка будет: link + '?page='+page </script> </head> <body> <!--Конечно, полностью верстать не буду--> <div id="navigation"> <div onclick="ShowContent('server.php', 'index')">Главная</div> <div onclick="ShowContent('server.php', 'page1')">Страница 1</div> <div onclick="ShowContent('server.php', 'page2')">Страница 2</div> </div> <div id="contentBody" /> </body> </html> На серверной части, файл server.php: PHP код: `switch($_GET['page']) { case "index": echo "Это главная страница"; break; case "page1": echo "Страница 1"; break; case "page2"; echo "Страница 2"; break; default: echo "404"; }` Последний раз редактировалось yury_coder; 14.01.2011 в 13:44.

14.01.2011, 16:31	#5
13th Форумчанин Регистрация: 31.12.2008 Сообщений: 634	в данном случае , если приводить пример , то делать всё за тебя ибо кусками не выйдет. основы я тебе написал - дальше копай сам. только вот еще что скажу, можно так грамотно прописать правила mod_rewrite что хеши будут идти как идентификаторы страниц и если не будет включен джаваскрипт у пользователя, то он сможет все равно видит разные страницы, в зависимости от хеша, отданные серверным скриптом. костяк у тебя есть - разбирайся. зайди на джиквери api.jquery.com - метод ajax Возможно всё Пишу обо всем

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
печать данных полученных на бейсике	qscft	Помощь студентам	6	02.01.2011 01:23
Парсинг полученных данных	Shouldercannon	Общие вопросы Delphi	11	09.01.2010 21:47
Обработка данных полученных из формы	Linel	PHP	4	23.04.2009 14:38
Выбор данных с листов через выпадающий список	DimDimos	Microsoft Office Excel	5	17.12.2008 11:27
Диаграмма на основе полученных табличных данных	Dark_Maks	Общие вопросы .NET	0	07.05.2008 03:25

14.01.2011, 02:35	#3
MarkStaver Регистрация: 22.01.2010 Сообщений: 9	Походу пол третьего надо всеже спать ))) в принципе понял но это повлекло еще миллиард вопросов которые просто порвали и без того воспаленный мозг есть пример кода кроме гугла? в нем покапаюсь завтра сегодня такую жирную пищу не осилю ))))))