<object id="list" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="list.txt">
<param name="FieldDelim" value="|">
<param name="UseHeader" value="True">
</object>
Динамическая подгрузка данных (DHTML, JS)
Нужно реализовать строку поиска, которая динамически отображает искомые варианты. Ну вы знаете... Как на странице GOOGLE - вводите слово и сразу динамически показываются варианты.
По части создания и заполнения DIVа с position: absolute я разберусь.
Интересует, как подгружать данные? К примеру из http://site/search.aspx?q='Input.Value'
В книжке нашел только такой пример:
Он работает с текстовым файлом, но не работает, если в качестве DataURL написать настоящий URL. (к примеру http://site/search.aspx). Проверял. Всё правильно делал, но может что-то не то? В книжке "Dynamic HTML" ничего нет по этому поводу.
В общем, вопрос: Как проще организовать данную подгрузку данных? Как это сделать?
ps) желательно, чтобы код был компактнее. кросс-браузерность не обязательна. будет использоваться IE 6.
pps) ссылки, примеры (понятные), литература приветствуются. яндех по запросу "html связывание данных" ничего путного не выдаёт.
Смотрел HTML-код страницы GOOGLE - хоть убейте, не могу разобраться. Там "<object" вообще не встречается. Как идёт тогда динамическая подгрузка?
Заранее спасибо, надеюсь на Вашу помощь...
По части создания и заполнения DIVа с position: absolute я разберусь.
Интересует, как подгружать данные? К примеру из http://site/search.aspx?q='Input.Value'
В книжке нашел только такой пример:
Код:
Он работает с текстовым файлом, но не работает, если в качестве DataURL написать настоящий URL. (к примеру http://site/search.aspx). Проверял. Всё правильно делал, но может что-то не то? В книжке "Dynamic HTML" ничего нет по этому поводу.
В общем, вопрос: Как проще организовать данную подгрузку данных? Как это сделать?
ps) желательно, чтобы код был компактнее. кросс-браузерность не обязательна. будет использоваться IE 6.
pps) ссылки, примеры (понятные), литература приветствуются. яндех по запросу "html связывание данных" ничего путного не выдаёт.
Смотрел HTML-код страницы GOOGLE - хоть убейте, не могу разобраться. Там "<object" вообще не встречается. Как идёт тогда динамическая подгрузка?
Заранее спасибо, надеюсь на Вашу помощь...
там используется Ajax. погуглите на эту тему, я встречал в сети примеры именно такие как вам надо. к сожалению в букмарки не занес :)
Спасибо.
Жаль конечно что для этих целей используется целый толмут java-скриптов. Я надеялся, что будет меньше. Ну да ладно...
По поводу backend'а. Там есть только на PHP, а мне нужно делать на VS.NET 2005 (C#).
Как функционирует backend? В каком формате нужно возвращать данные?
Цитата: alexandr_nv
Как функционирует backend? В каком формате нужно возвращать данные?
я вот поэтому вам и посоветовал погуглить на тему AJAX, а не использовать готовые библиотеки, чтобы понять - что и как работает.
суть AJAX - отсылка обычного POST/GET/HEAD запроса на бэкенд и получени в ответ данных в формате XML (или plain text - смотря что надо).
вот и все. Ajax'у - пофигу на чем функционирует бэкенд. хоть на C#, хоть на коболе.
советую начать изучение отсюда:
http://www.ibm.com/developerworks/ru/library/wa-ajaxintro1/index.html
там 7 статей на тему освоения AJAX
там правда тоже PHP, но, если поймете принцип, то заюзать C# вам будет несложно.
Эх, снова траблы...
Нашел я вот такой код:
Всё работает отлично ЕСЛИ файл HTML лежит на жестком диске:
[HTML]
<script type="text/javascript" language="JavaScript" src="mysearch.js"></script>
<body>
<input type="TEXT" size="50" id="_search" onKeyUp="doLoad()">
<span id="_content"></span>
[/HTML]
Но когда я это всё запускаю через веб-сервер - выдаёт ошибку.
Вот в этой строчке:
IE пишет: неопознанная ошибка. А если изменить эту строчку на try { req.send(null) } catch (e) { alert(e) }; - то вылезет alert с "[ Object error ]".
WTF? Помогите пожалуйста. Как быть?
Нашел я вот такой код:
Код:
function doLoad () {
req=false;
try { // определить метод поддержки
req=new ActiveXObject('Msxml2.XMLHTTP');
} catch (e) {
try {
req=new ActiveXObject('Microsoft.XMLHTTP'); // сработает в Internet Explorer
} catch (e) {
if(window.XMLHttpRequest){ // сработает в Mozilla и Safari
req=new XMLHttpRequest();
}
}
}
if (req){// если какой-то из вариантов поддерживается
req.onreadystatechange = readystate; // назначим обработчик событию объекта
req.open("GET", "http://localhost:3623/WebSite2/list.aspx?q="+document.getElementById('_search').value, true);
req.send(null);
}
}
function readystate() {
if (req.readyState == 4){// если запрос завершен
if (req.status == 200) { // если он завершен без ошибок
document.getElementById("_content").innerHTML = req.responseText;
} else {
alert("Произошла ошибка "+ req.status+":\n" + req.statusText);
}
}
}
req=false;
try { // определить метод поддержки
req=new ActiveXObject('Msxml2.XMLHTTP');
} catch (e) {
try {
req=new ActiveXObject('Microsoft.XMLHTTP'); // сработает в Internet Explorer
} catch (e) {
if(window.XMLHttpRequest){ // сработает в Mozilla и Safari
req=new XMLHttpRequest();
}
}
}
if (req){// если какой-то из вариантов поддерживается
req.onreadystatechange = readystate; // назначим обработчик событию объекта
req.open("GET", "http://localhost:3623/WebSite2/list.aspx?q="+document.getElementById('_search').value, true);
req.send(null);
}
}
function readystate() {
if (req.readyState == 4){// если запрос завершен
if (req.status == 200) { // если он завершен без ошибок
document.getElementById("_content").innerHTML = req.responseText;
} else {
alert("Произошла ошибка "+ req.status+":\n" + req.statusText);
}
}
}
Всё работает отлично ЕСЛИ файл HTML лежит на жестком диске:
[HTML]
<script type="text/javascript" language="JavaScript" src="mysearch.js"></script>
<body>
<input type="TEXT" size="50" id="_search" onKeyUp="doLoad()">
<span id="_content"></span>
[/HTML]
Но когда я это всё запускаю через веб-сервер - выдаёт ошибку.
Вот в этой строчке:
Код:
req.send(null);
IE пишет: неопознанная ошибка. А если изменить эту строчку на try { req.send(null) } catch (e) { alert(e) }; - то вылезет alert с "[ Object error ]".
WTF? Помогите пожалуйста. Как быть?
а ничего что в коде такая строка есть?
естественно работает только на локальной машине - локалхост он и в африке локалхост
Код:
req.open("GET", "http://localhost:3623/WebSite2/list.aspx?q="+document.getElementById('_search').value, true);
естественно работает только на локальной машине - локалхост он и в африке локалхост
вообще, через XMLHttpRequest open нельзя делать "кроссдоменные" заросы, т. е. - к скриптам, которые находяться где-то за пределами данного хоста.
А если я отлаживаюсь на локальной машине, а за данными лезу на сервер?
Но у метя ошибка на Open вылазит что такия (Open) функция не найдена.
/*****************************************************/
И вот ещё какой момент. Почему-то при команде "alert (req);" (req - это создаваемый XMLHttpRequest) я получаю текст функции создания :confused:
Но у метя ошибка на Open вылазит что такия (Open) функция не найдена.
/*****************************************************/
И вот ещё какой момент. Почему-то при команде "alert (req);" (req - это создаваемый XMLHttpRequest) я получаю текст функции создания :confused:
Код:
---------------------------
Microsoft Internet Explorer
---------------------------
function () // загрузчик названий страниц каталога
{
var req2;
if (window.XMLHttpRequest)
{
req2 = new XMLHttpRequest();
}
else
if (window.ActiveXObject)
{
req2 = new ActiveXObject("Msxml2.XMLHTTP");
}
req2.onreadystatechange =
function()
{
if (req2.readyState == 4)
{
if (req2.status == 200)
{
titlePage = req2.responseText;
}
else
{
titlePage = "";
alert('Ошибка получения названия страници.');
}
}
return req2;
}
}
---------------------------
ОК
---------------------------
Microsoft Internet Explorer
---------------------------
function () // загрузчик названий страниц каталога
{
var req2;
if (window.XMLHttpRequest)
{
req2 = new XMLHttpRequest();
}
else
if (window.ActiveXObject)
{
req2 = new ActiveXObject("Msxml2.XMLHTTP");
}
req2.onreadystatechange =
function()
{
if (req2.readyState == 4)
{
if (req2.status == 200)
{
titlePage = req2.responseText;
}
else
{
titlePage = "";
alert('Ошибка получения названия страници.');
}
}
return req2;
}
}
---------------------------
ОК
---------------------------