Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: для новичков > Динамический список


Автор: Serebrus 22.7.2008, 10:19
Привет всем.
У меня такой вопрос:
Имеется поля ввода текста (<input type=text>).
Надо чтобы при вводе части фамилии показывался список фамилий (имеющиеся в базе) начинающихся с вводимым текстом.
Как можно это сделать не перезагружая страницу (Не очень знаком с AJAX)? 

Автор: comtat 22.7.2008, 10:31
http://forum.vingrad.ru/forum/topic-221054.html

Автор: Sanchezzz 22.7.2008, 10:41
Это в пхп файл test.php
Код

<?
require_once("jshttprequest.php");
$Js = new JsHttpRequest('windows-1251'); 

$dbname=""; //бд наме
$dbhost="localhost"; //хост
$bduser="user"; //узер
$bdpass=""; //пасс
$dbname="temp"; //имя базы

mysql_connect($dbhost,$dbuser,$dbpass);

mysql_select_db($dbname);

/* принемаем данные */

$temp =''; //временая переменная 

if($_REQUEST['text_input']!=''){
//тут sql запрос к бд
$res = mysql_query("");

while($rows= mysql_fetch_array($res)){

//обробатываешь полученные данные

$temp.='тут html код';

}
//ответ 
$GLOBALS['_RESLT']['otvet']=$temp;
}

mysql_close();
?>


это в html

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
</head>

<body>
<script type="text/javascript" src="JsHttpRequest.js"></script>
<script type="text/javascript">

function showload(){document.getElementById('ajaxload').style.display = "block"}
function hideload(){document.getElementById('ajaxload').style.display = "none";}

function doLoad(){
val = document.getElementById('textinput');
var req = new JsHttpRequest();
req.onreadystatechange = function() {                
showload();
if (req.readyState == 4) {
hideload();
document.getElementById('otvet').innerHTML = req.responseJS.otvet;
 }
}
req.open(null, 'inc/calen.php', true);

//text_input это будем ловить в php val.value значение
req.send({text_input:val.value});            
}


</script>


<input name="text" id="textinput" type="text" onkeyup="doLoad()"/>
<div id="ajaxload" style="display:none;">L O A D I N G ...</div>
<div id="otvet"></div>

</body>
</html>


в моем коде могут буть не точности так что тебе придется скачать JsHttpRequest и прочитать про него там это самый лучший крос-браузерный аякс http://forum.dklab.ru/



Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)