Интерактивный select с помощью ajax

Anneta · 6 фев 2011

Здравствуйте! Помогите пожалуйста разобраться.
Я хочу связать два выпадающих списка с помощью ajax используя библиотеку JsHttpRequest, что бы было без перезагрузки. Попыталась сделать по примеру: http://pyha.ru/articles/php/ajax-select-jshttprequest/

структуры используемых таблиц:
table style
`id_style` int(8) unsigned NOT NULL AUTO_INCREMENT,
`name` varchar(50) NOT NULL,
PRIMARY KEY (`id_style`)

table genre
`id_genre` int(8) unsigned NOT NULL AUTO_INCREMENT,
`name` varchar(50) NOT NULL,
`id_style` int(8) unsigned DEFAULT NULL,
PRIMARY KEY (`id_genre`)

index.php

PHP:

<?php

require("mysql.php");

require_once("Smarty/Smarty.class.php");

$smarty = new Smarty();

$style = array();

$query_style = "SELECT * FROM style ORDER BY id_style";

$sql = mysql_query($query_style) or die(mysql_error(''));

while ($row = mysql_fetch_assoc($sql)) {

$style[] = $row;

}

$smarty->assign('style',$style);

$smarty->display("main.tpl");

?>

шаблон smarty

HTML:

<html>

<head>

<title>пример</title>

</head>

<body>

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

<script>

{literal}

function doload(value){

var req=new JsHttpRequest();

req.onreadystatechange=function(){

if(req.readyState==4) document.getElementById("result").innerHTML=req.responseText;}

req.open(null,"select2.php",true);

req.send({style:value});}

{/literal}

</script>

{*Выводим список style*}

<select name="style" id="style" onchange="doload(this.value);">

<option value="">-select style-</option>

{foreach name="style" from=$style item="style"}

<option value="{$style.id_style}">{$style.name}</option>

{/foreach}

</select>

<div id="result"></div>

</body>

</html>

Скрипт, который передает данные( пробовала вписать его в index.php, все равно ни чего не работает )

PHP:

<?

require("../lib/JsHttpRequest.php"); //Подключаем библиотеку

$JsHttpRequest=new JsHttpRequest("utf-8");

if (!empty ($_REQUEST["style"])){

$id_style = $_REQUEST["style"];

$genre = array();

$query = "SELECT * FROM genre WHERE id_style='$id_style'";

$sql = mysql_query($query) or die(mysql_error(''));

$html="<select name=\"genre\">";

while ($row = mysql_fetch_assoc($sql)) {

$html.="<option value=\"".$row['id_genre']."\">".$row['name']."</option>";

}

echo $html.="</select>";

}

?>

Заранее всем большое спасибо за помощь...

Benjamin · 18 фев 2011

Попробуйте реализовать без Smarty.

Интерактивный select с помощью ajax

Anneta Активный пользователь

Benjamin Активный пользователь

Быстрый поиск

Интерактивный select с помощью ajax

Anneta Активный пользователь

Benjamin Активный пользователь