Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Подгрузка страницы с помощью Ajax / 7 сообщений из 7, страница 1 из 1
12.12.2008, 10:02
    #35709924
Большой Синий Кит
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
Скажите, пожалуйста, в чем проблема.

У меня есть html страница. На нее с помощью ajax выводится содержимое других html-страниц.
Вот основная страница, на которую все грузится:
Код: plaintext
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.
52.
53.
54.
55.
<html>
<head>
    <script type="text/javascript" src="js/contentloader.js">
    </script>
    <script type="text/javascript" src="js/searchpanel.js">
    </script>
    <script type="text/javascript" src="js/createperson.js">
    </script>

    <script type="text/javascript">

        function getPageFromServer(url, listener, method) {
            if (!method) method = "GET";

            var loader = new net.ContentLoader(url, listener, method);
        }
        ;

        function loadSearchPanel() {
            var console = document.getElementById('searchpanel');
            console.innerHTML = this.request.responseText;
        }
        ;

        function loadCreatePersonPanel() {
            var console = document.getElementById('createperson');
            console.innerHTML = this.request.responseText;

        }
        ;

    </script>
</head>
<body>


<center>
    <a href="#" id="/start/searchpanel.html" onclick="getPageFromServer('/start/searchpanel.html',loadSearchPanel);">Search</a>
    <a href="#" id="/start/createperson.html"
       onclick="getPageFromServer('/start/createperson.html',loadCreatePersonPanel);">Create Person</a>
</center>


<div id="searchpanel">
</div>


<div id="createperson">
</div>


</body>

</html>


Вот одна их подгружаемых страниц:
Код: plaintext
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.
<html>
<head>
    <title>Address book</title>
</head>


<body>

<input type="hidden" name="ftlname" value="listpersons.ftl"/>
<input type="hidden" name="searchby" value="lastname"/>
<select name="typeofsearch" onchange="typeofSearchchanged(this);">
    <option>Last Name</option>
    <option>First Name</option>
</select>
<br/>
<input type="text" name="searchvalue"/>
<input type="button" name="startbutton" value="Search" onclick="loadXMLDoc('actions.Search.f');"/>

<div id="output">

</div>

</body>

</html>


Мне непонятна следующая вещь....
Как Вы заметили, на основной странице я подключил все java-скрипты, которые используются во всех подгружаемых страницах. Сделал я это потому, что после подгрузки дочерней страница на родительскую, дочерняя не видит свой скрипт. То есть если написать какой-либо скрипт в теле дочерней страницы, то после подгрузки на основную, эта дочерняя не видит этот скрипт. Пишет, что такой-то метод не найден на такой-то строке... его просто там нет.
Если скрипт подключать в хедере каждой дочерней страницы, то после добавления ее на основную, скрипт опять же теряется.

Почему?? Я понимаю, что видимо, делаю что-то не так.
И насколько нормально выглядит конструкция описанная выше?

Заранее благодарен.

P.S.
ContentLoader, с помощью которого подгружаются страницы, выглядит вот так:
Код: plaintext
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.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
var net = new Object();

net.READY_STATE_UNINITIALIZED =  0 ;
net.READY_STATE_LOADING =  1 ;
net.READY_STATE_LOADED =  2 ;
net.READY_STATE_INTERACTIVE =  3 ;
net.READY_STATE_COMPLETE =  4 ;
/**
 * This is main object for generate POST and GET requests
 * @param url url
 * @param onload function that will work over result of request
 * @param content content for inserting into request
 * @param onerror function that will catch errors
 * @param method POST or GET
 * @param contentType Content-Type - that inserting into heander
 */
net.ContentLoader = function(url, onload, method, content, onerror, contentType) {

    this.url = url;
    this.onload = onload;
    this.content = content;
    this.onerror = (onerror) ? onerror : this.defaultError;
    this.loadXMLdoc(method, contentType);
};

net.ContentLoader.prototype.loadXMLdoc = function(method, contentType) {
    var method = (method) ? method : "POST";

    if (!contentType && method == "POST") {
        contentType = 'application/x-www-form-urlencoded';
    }

    if (window.XmlHttpRequest) {
        this.request = new XmlHttpRequest();
    } else if (window.ActiveXObject) {
        this.request = new ActiveXObject("Microsoft.XMLHTTP");
    }

    if (this.request) {
        var loader = this;
        try {
            this.request.onreadystatechange = function() {
                loader.onReadyState.call(loader);
            };
            this.request.open(method, this.url, true);
            if (contentType) {
                this.request.setRequestHeader('Content-Type', contentType);
            }
            this.request.send(this.content);
        } catch(err) {
            this.onerror.call(this);
        }
    }

};

net.ContentLoader.prototype.onReadyState = function() {
    var req = this.request;
    if (req.readyState == net.READY_STATE_COMPLETE) {
        var httpstatus = req.status;
        if (httpstatus ==  200  || httpstatus ==  0 ) {
            this.onload.call(this);
        } else {
            this.onerror.call(this);
        }
    }
};


net.ContentLoader.prototype.defaultError = function() {
    alert("Error fetching data!" +
          "ReadyState=" + this.request.readyState);
};
...
Рейтинг: 0 / 0
12.12.2008, 10:17
    #35709979
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
Это тот самый случай, когда решение задачи перепутано с её постановкой. Смысл-то этих манипуляций в чём?
Если типа "у меня есть проект, я хочу его переделать под аякс, чтоб всё на одной странице было" - это фантастика... .
...
Рейтинг: 0 / 0
12.12.2008, 10:29
    #35710019
Большой Синий Кит
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
Нет, у меня нет проекта! :)
Я его только пишу - для изучения ajax+EJB3+JPA.
Сформированы ejb-бины, написаны Entity для работы с базой.
Теперь хочется сделать так, чтобы web-интерфейс был красивым, чтобы запросы к серверы были асинхронные, поэтому начал изучать ajax...
Я в этом деле полный новичок.

Скажите тогда, как лучше?

Сейчас при клике на "Search" ссылке с сервера подгружается html-страница,которая вставляется на основную. Лучше включить ее сразу на основную страницу в какой-то div, а потом просто делать видимым или невидимым его?
...
Рейтинг: 0 / 0
12.12.2008, 10:52
    #35710102
Большой Синий Кит
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
Ну хорошо, конечно можно сделать так...
Но как быть с шаблонами?
Вот к примеру, в результате каких-либо операций на сервере, я заполняю шаблон freemarker'а, и его отправляю клиенту. Этот заполненный шаблон представляет собой в итоге просто html-содержимое.
И есть java-script в теле этого шаблона, который должен обрабатывать данные на этом заполненном шаблоне. Так вот этот скрипт тоже не виден при добавлении html-содержимого, сформированного с помощью freemarker'а, на родительскую страницу...
Да, если добавить этот скрипт на родительскую страницу, все должно заработать.. Но это как-то не очень красиво выглядит, импортировать скрипт на страницу, на которой обрабатываемые компоненты появляются динамически.
...

Как быть? Подскажите, пожалуйста, опытные в этом деле люди...
...
Рейтинг: 0 / 0
12.12.2008, 11:13
    #35710188
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
М.б. задать на хоруме про яву?
Вообще-то, наверняка для случаев, когда "компоненты появляются динамически" есть стандартные приёмы (по аспнет сужу).
...
Рейтинг: 0 / 0
12.12.2008, 11:29
    #35710265
Большой Синий Кит
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
Вот пример такой:



Вот к примеру, есть основная страница:
Код: plaintext
1.
2.
3.
4.
5.
<html>

<div id='div' >
</div>
</html>






И есть заполненный шаблон
Код: plaintext
1.
<input type='button' onclick='doSomething();'/>



Когда это сожержимое приходим на основную страницу, она добавляет его с помощью innerHTML в div:
Код: plaintext
1.
2.
3.
<div id='div'>
<input type='button' onclick='doSomething();'/>
</div>



Как мне прикрутить javascript с функцией doSomething() - то есть как правильно это сделать?
...
Рейтинг: 0 / 0
12.12.2008, 15:14
    #35711214
Большой Синий Кит
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Подгрузка страницы с помощью Ajax
Вот так можно:

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
/**
* include
*
* Функция подключения JS файлов
*
* @string путь к загружаемому файлу
* @return boolean
*/
function include(jsFile){
  var htmlDoc=document.getElementsByTagName('head').item( 0 );
  var js=document.createElement('script');
  js.setAttribute('language', 'javascript');
  js.setAttribute('type', 'text/javascript');
  js.setAttribute('src', jsFile);
  htmlDoc.appendChild(js);
  return false;
}

...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Подгрузка страницы с помощью Ajax / 7 сообщений из 7, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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