Задача:
Есть две таблицы в mysql
1 категории
Поля:
id | cat_name |
2 Подкатегории
Поля:
id | sub_catname | parent_dir_id |
Необходимо сделать, чтобы при загрузке страницы, формировался селект с данными по категориям, например так:
<select>
<option value="id">cat_name</option>
</select>
Далее, после выбора, нужно передать скрипту данные селекта, чтобы сделать запрос для вывода подкатегорий. Нужно во второй селект подгрузить подкатегории.
Как это реализовать на php я знаю, но мне нужно сделать на JS
Госопда, если есть готовые решения, не пинайте пожалуйста, дайте ссылочку, если можете помочь, подскажите, пожалуйста, как это реализовать.
Основная проблема в том, что я в JS не особо разбираюсь, на уровне "подправить готовый скрипт".
Я видел пост:
http://phpforum.ru/index.php?showtopic=19283
Может с помощью этого класса получится сделать?
Спустя 19 минут, 31 секунда (9.01.2011 - 07:45) kirik написал(а):
Это называется динамичискими селектами списками и вот тема. Там же в теме есть готовое решение, чтобы можно было поковырять 
Спустя 14 минут, 4 секунды (9.01.2011 - 07:59) depporter написал(а):
kirik, спасибо большое, попробую поковырять. Но мне больше приглянулся Ваш класс, попробую на нем реализовать, дух ООП как то ближе и вызывает доверие)
Спустя 1 час, 30 минут, 53 секунды (9.01.2011 - 09:30) Fredrich написал(а):
depporter ну что разобрался?
Спустя 2 минуты (9.01.2011 - 09:32) depporter написал(а):
пока нет, сейчас на работе. Вечером буду тестировать. Отпишу, если не получится.
Спустя 1 минута, 44 секунды (9.01.2011 - 09:33) Fredrich написал(а):
Добро
Спустя 6 минут, 4 секунды (9.01.2011 - 09:40) kirik написал(а):
| Цитата (depporter @ 9.01.2011 - 01:32) |
| Отпишу, если не получится. |
Полюбому получится, там все не так сложно как кажется
Спустя 51 минута, 57 секунд (9.01.2011 - 10:31) depporter написал(а):
Господа, все получилось. На примере Поста, который порекомендовал kirik.
Спасибо за консультацию и направления. Всех с прошедшими праздниками и удачи в новом году.
Спасибо за консультацию и направления. Всех с прошедшими праздниками и удачи в новом году.
Спустя 3 часа, 24 минуты, 34 секунды (9.01.2011 - 13:56) depporter написал(а):
Нет, все же сделал по своему.
Вот решение:, может быть кому пригодится.
HTML
PHP
JS
Код не оптимизировал, писал можно сказать на коленке, но все работает. Поэтому, перед использованием, все же следует, подумать, как все это обезопасить и укоротить.
Реализовано на jquery версии -1.4.4
Вот решение:, может быть кому пригодится.
HTML
<style>
.region, .city, .subcategory {display:none}
strong {display:block;width:50px}
div {margin-bottom:3px}
select {width:350px}
</style>
<div class="category">
<p><font color="red">*</font>Основная категория</p>
<select name="category" id="category">
<option value="" selected>Выберите категорию</option>
</select>
</div>
<div class="subcategory">
<p><font color="red">*</font>Подгатегория</p>
<select name="subcategory" id="subcategory">
<option value="">Выберите подкатегорию</option>
</select>
</div>
PHP
$getter = new docat($db_host, $db_user, $db_pass, $db_name);
if (isset($_POST['get_cat'])) {
$getter->get_categories();
} else {
$getter->get_subcategory();
}
class docat {
private $db;
public $xml = '<?xml version="1.0" encoding="utf8"?><root>';
function __construct($db_host, $db_user, $db_pass, $db_name) {
$this->db = mysql_connect($db_host, $db_user, $db_pass);
mysql_select_db($db_name, $this->db);
mysql_query('SET NAMES utf8');
mysql_query('SET CHARACTER SET utf8');
mysql_query('SET COLLATION_CONNECTION="utf8_general_ci"');
}
function get_categories() {
$mysql_result = mysql_query("SELECT * FROM brd_categories ORDER BY cat_name", $this->db);
while($category = mysql_fetch_assoc($mysql_result)) {
$this->xml .= '<category>';
$this->xml .= '<cat_id>'.$category['id'].'</cat_id>';
$this->xml .= '<cat_name><![CDATA['.$category['cat_name'].']]></cat_name>';
$this->xml .= '</category>';
}
$this->print_xml();
}
function get_subcategory($cat_id) {
$mysql_result = mysql_query("SELECT * FROM brd_subcategories WHERE parent_dir= ".intval($cat_id)." ORDER BY category_name", $this->db);
while($subcategory = mysql_fetch_assoc($mysql_result)) {
$this->xml .= '<subcategory>';
$this->xml .= '<id>'.$subcategory['id'].'</id>';
$this->xml .= '<category_name><![CDATA['.$subcategory['category_name'].']]></category_name>';
$this->xml .= '</subcategory>';
}
$this->print_xml();
}
}
JS
$(document).ready(function(){
$.post("http://site.ru/engine/classes/cities.class.php", {get_cat: 1},
function (xml) {
$(xml).find('category').each(function() {
id = $(this).find('cat_id').text();
$("#category").append("<option value='" + id + "'>" + $(this).find('cat_name').text() + "</option>");
});
});
$("#category").change(function() {
cat_id = $("#category option:selected").val();
if (cat_id == "") {
$(".subcategory").hide();
}else {
$("#subcategory").html('');
$("#subcategory").html('<option value="">Выберите подкатегорию</option>');
$.post("http://site.ru/engine/classes/cities.class.php", {subcategory: cat_id},
function (xml) {
$(xml).find('subcategory').each(function() {
id = $(this).find('id').text();
$("#subcategory").append("<option value='" + id + "'>" + $(this).find('category_name').text() + "</option>");
});
});
$(".subcategory").show();
}
});
});
Код не оптимизировал, писал можно сказать на коленке, но все работает. Поэтому, перед использованием, все же следует, подумать, как все это обезопасить и укоротить.
Реализовано на jquery версии -1.4.4