Подскажите, пожалуйста! В общем что надо: есть форма для передачи в БД. В ней - 2 выпадающих списка. Причем второй зависит отпервого. То есть, в зависимости от того, что ты выберешь в первом списке, будет формироваться второй (его элементы). Позвоночником чую, что с помощью html и
php не сделать (хотя если можно, то даже лучше). Спасибо!
Спустя 2 минуты, 26 секунд (22.12.2006 - 19:45) vasa_c написал(а):
Спустя 3 минуты, 6 секунд (22.12.2006 - 19:48) tishka написал(а):
упссссс :o! Значит плохо искал! Спасибо!
Спустя 2 года, 7 месяцев, 26 дней, 18 часов, 3 минуты, 6 секунд (19.08.2009 - 12:51) glivera написал(а):
ссылка выше умерла, интересует примерно тоже, есть БД необходимо чтобы при выборе значения из первого списка формировался список возможных значений второго списка... убил кучу времени на эту ерунду, ниче не получилось((
Спустя 1 час, 40 минут, 27 секунд (19.08.2009 - 14:31) Michael написал(а):
Лучше всего с AJAX подгружать по необходимости нужные данные.
Но можно и без гонять данные туда-сюда( если мало данных то пойдет) - по onchange первого списка делаешь submit формы, а на сервере по выбранному элементу формируешь зависящий список. Ну и фокус на зависящий список на JavaScript установи при загрузке.
Спустя 15 часов, 28 минут, 10 секунд (20.08.2009 - 05:59) glivera написал(а):
данные придется большие гонять, поэтому предпочтительнее аякс будет... интересует практическая часть реализации, ибо в аяксе ничего не смыслю(
Спустя 1 час, 20 минут, 6 секунд (20.08.2009 - 07:19) Michael написал(а):
Спустя 3 часа, 7 минут, 41 секунда (20.08.2009 - 10:27) SunSet написал(а):
у twin'а есть очень хороший пример с динамической подгрузкой в зависимости что выбрано. Я с работы сейчас, потому нету ссылки под рукой.
Спустя 2 часа, 57 минут, 45 секунд (20.08.2009 - 13:25) glivera написал(а):
спасибо, тот пример с аяксом очень помог, но только там один минус для меня, передача происходит, когда мы нажимаем на кнопку, хотелось бы чтобы передача данных шла когда изменится содержание первого поля... я так понимаю тут надо использовать OnChange для этого объекта... но как реализовать не догоняю немного... Вот то то у меня получилось
| PHP |
<html>
<head>
<script type="text/javascript" language="javascript">
var req = Create();
function ge(id)
{
return document.getElementById(id);
}
function Create(){
if(navigator.appName == "Microsoft Internet Explorer"){
req = new ActiveXObject("Microsoft.XMLHTTP");
}else{
req = new XMLHttpRequest();
}
return req;
}
function Request(query)
{
req.open('post', 'ajax.php' , true );
req.onreadystatechange = Refresh;
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
req.send(query);
}
function Refresh()
{
if( req.readyState == 4 )
ge('ajax').innerHTML = req.responseText;
else
ge('ajax').innerHTML = '<img src="prel.gif" />';
}
function Pusk()
{
var query;
query ='txt='+encodeURIComponent(ge('myid').value);
Request(query);
}
</script>
</head>
<body>
<div id="ajax"></div>
<? include "../admin/baza.php";
$querys_klient = mysql_query("SELECT * FROM user");
echo "<select size=\"1\" id=\"myid\" style=\"width:100%\" class=\"border\">
<option value=\"\">Выберете Юр. лицо клиента</option>" ;
while ($queryss_klient = mysql_fetch_array($querys_klient))
{
$login = $queryss_klient['login'];
$klient = $queryss_klient['id'];
$nazvanie = $queryss_klient['nazvanie'];
echo "<option value=\"$klient\">$klient</option>";
}
echo "</select>";
?>
<input type="button" value="ТЫРЦ" onClick="Pusk()">
<img src="prel.gif" width="1" height="1" |
и второй файл, где заполняется второй селект
| PHP |
<?php
include "../admin/baza.php";
$txt = $_POST['txt'];
echo "<select size=\"1\" id=\"adres\" name=\"adres\" style=\"width:100%\" class=\"border\">
<option value=\"\">Выберете адрес</option>" ;
$zapros = mysql_query(" SELECT * FROM user WHERE id = $txt ");
$zapros = mysql_fetch_array($zapros);
$adres = $zapros['adres'];
$adres_preg = preg_split('~\s*;\s*~', $adres);
foreach($adres_preg as $znach) {
If ($znach !== "")
{
echo "<option value=\"$klient\">$znach</option>";
}
}
echo "</select>";
|
Спустя 17 минут, 35 секунд (20.08.2009 - 13:42) Michael написал(а):
Попробуй так:
в первом селекте измени:
| PHP |
echo "<select size=\"1\" id=\"adres\" name=\"adres\" style=\"width:100%\" onChange=\"Pusk()\" class=\"border\">"; |
Спустя 54 минуты, 32 секунды (20.08.2009 - 14:37) glivera написал(а):
ой, отлично, почти получилось все, только теперь при изменении в первом селекте происходит просто переключение на второй... скрипты немного поменялись
| PHP |
<html>
<head>
<script src="../js/jquery-1.3.1.js" type="text/javascript"></script>
<title>Редактирование данных пользователя</title>
<script src="../kalendar/datepicker.js" type="text/javascript" charset="UTF-8" language="javascript"></script>
<link rel="stylesheet" type="text/css" href="../kalendar/datepicker.css" />
<script type="text/javascript" language="javascript">
var req = Create();
function ge(id)
{
return document.getElementById(id);
}
function Create(){
if(navigator.appName == "Microsoft Internet Explorer"){
req = new ActiveXObject("Microsoft.XMLHTTP");
}else{
req = new XMLHttpRequest();
}
return req;
}
function Request(query)
{
req.open('post', '../js/ajax.php' , true );
req.onreadystatechange = Refresh;
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
req.send(query);
}
function Refresh()
{
if( req.readyState == 4 )
ge('preview').innerHTML = req.responseText;
else
ge('preview').innerHTML = '<img src="prel.gif" />';
}
function Pusk()
{
var query;
query ='txt='+encodeURIComponent(ge('klient').value);
Request(query);
}
</script>
</head>
<body>
<?
$new_date_today = date("0n/j/Y");
?>
<br> <table width="100%"><tr><td colspan="2" class="error" align="center"><b></b>
<form action="registr_zayavka.php" method="post" name="preview" id="preview" onsubmit="return checkPass()>
<div class="form">
<table border="1" width="100%" id="table1">
<tr>
<td width="20%" valign="bottom"><p>Код<br><input type="text" name="kod" style="width:100%" class="border" value="" /> </p></td>
<td width="20%" colspan="2" valign="bottom"><p>Тип<br><input type="text" name="tip" style="width:100%" class="border" value="" /> </p></td>
<td width="20%" colspan="2" valign="bottom"><p>План:<br>
<input type="text" name="plan_date" style="width:60%" class="border" value="<? echo $new_date_today ?>"><input type="button" style="background: url('../kalendar/datepicker.jpg') no-repeat; width: 40px; border: 0px;" onclick="displayDatePicker('plan_date', false, 'mdy', '/');">
</p></td>
<td width="20%" colspan="2" valign="bottom"><p>Введите факт. дату:<br>
<input type="text" name="fakt_date" style="width:60%" class="border" value=""><input type="button" style="background: url('../kalendar/datepicker.jpg') no-repeat; width: 40px; border: 0px;" onclick="displayDatePicker('fakt_date', false, 'mdy', '/');">
</p></td>
<td width="20%" valign="bottom"><p>Ответственный<br>
<?
$querys = mysql_query("SELECT * FROM manager");
echo "<select size=\"1\" name=\"id_manager\">
<option value=\"0\">Выберете менеджера</option>" ;
while ($queryss = mysql_fetch_array($querys))
{
$fio = $queryss['fio'];
$id_manager = $queryss['id'];
echo "<option value=\"$id_manager\">$fio</option>";
}
echo "</select>";
?>
</p></td>
</tr>
<tr>
<td width="100%" colspan="8">Юр. лицо клиента
<?
$querys_klient = mysql_query("SELECT * FROM user");
echo "<select size=\"1\" id=\"klient\" name=\"klient\" style=\"width:100%\" onChange=\"Pusk()\" class=\"border\">
<option value=\"\">Выберете Юр. лицо клиента</option>" ;
while ($queryss_klient = mysql_fetch_array($querys_klient))
{
$login = $queryss_klient['login'];
$klient = $queryss_klient['id'];
$nazvanie = $queryss_klient['nazvanie'];
echo "<option value=\"$klient\">$login</option>";
}
echo "</select>";
?>
</td>
</tr>
<tr>
<td width="100%" colspan="8">Адрес клиента
<?
include "../js/ajax.php";
?>
</select>
</td>
</tr>
<tr>
<td width="100%" colspan="8">Явление<input type="text" name="yavlen" style="width:100%" class="border" value="" /> </p></td>
</tr>
<tr>
<td width="100%" colspan="8">Меры<input type="text" name="mery" style="width:100%" class="border" value="" /> </p></td>
</tr>
<tr>
<td width="25%" colspan="2">Время дор:<input type="text" name="vr_dor" style="width:100%" class="border" value="" /> </p></td>
<td width="25%" colspan="2">раб:<input type="text" name="vr_rab" style="width:100%" class="border" value="" /> </p></td>
<td width="25%" colspan="2">Документ<input type="text" name="dokument" style="width:100%" class="border" value="" /> </p></td>
<td width="25%" colspan="2">Сумма<input type="text" name="summa" style="width:100%" class="border" value="" /> </p></td>
</tr>
</table>
</div>
<p><input type="checkbox" name="agree" value="on" /> Данные введены корректно</p>
<p class="red" id="alert"></p>
<input type="hidden" name="PHPSESSID" value="805e740a1ef94886f0ee725597c21845" />
<input type="button" value="отправить" onclick="checkForm()" />
</form>
<script type="text/javascript">
function text (str) { return /[_;:'!~?=+<|>]/g.test(str); }
function checkForm ()
{
var title;
var elem;
var dutyField = "Не заполнено поле ";
var wrongField = "Неверное значение поля ";
var check = true;
function checkError (field, str)
{
document.getElementById("alert").innerHTML = str;
document.forms.preview.field.focus();
check = false;
}
document.getElementById("alert").innerHTML = "";
if (check)
{
title = '"Код"';
elem = document.preview.kod.value;
if (elem.length == 0) checkError('kod', dutyField + title);
else if (text(elem)) checkError('kod', wrongField + title);
}
if (check)
{
title = '"Тип"';
elem = document.preview.tip.value;
if (elem.length == 0) checkError('tip', dutyField + title);
else if (text(elem)) checkError('tip', wrongField + title);
}
if (check)
{
title = '"План"';
elem = document.preview.plan_date.value;
if (elem.length == 0) checkError('plan_date', dutyField + title);
else if (text(elem)) checkError('plan_date', wrongField + title);
}
if (check)
{
elem = document.preview.id_manager.value;
if (elem == 0) checkError('id_manager', 'Выберете ответственного');
}
if (check)
{
elem = document.preview.klient.value;
if (elem == 0) checkError('klient', 'Выберете Юридическое лицо клиента');
}
if (check)
{
title = '"Явление"';
elem = document.preview.yavlen.value;
if (elem.length == 0) checkError('yavlen', dutyField + title);
else if (text(elem)) checkError('yavlen', wrongField + title);
}
if (check)
{
elem = document.preview.agree.checked;
if (!elem) checkError('agree', 'Вы должны проверить данные');
}
if (check) { document.preview.submit(); }
return check;
}
</script>
</tab |
и второй
| PHP |
<?php
//include "../../admin/baza.php;";
if (!isset($_POST['txt']))
{ echo "<select size=\"1\" id=\"adres\" name=\"adres\" style=\"width:100%\" class=\"border\">
<option value=\"\">Выберете адрес</option>" ;
echo "</select>";
}
else
{
$txt = $_POST['txt'];
echo $txt;
echo "<select size=\"1\" id=\"adres\" name=\"adres\" style=\"width:100%\" class=\"border\">
<option value=\"\">Выберете адрес</option>" ;
$zapros = mysql_query(" SELECT * FROM user WHERE id = $txt ");
$zapros = mysql_fetch_array($zapros);
$adres = $zapros['adres'];
$adres_preg = preg_split('~\s*;\s*~', $adres);
foreach($adres_preg as $znach) {
If ($znach !== "")
{
echo "<option value=\"$klient\">$znach</option>";
}
}
echo "</select>";
}
|
Спустя 1 минута, 43 секунды (20.08.2009 - 14:39) glivera написал(а):
при изменении большая форма из первого листинга исчезает остается только один селект из второго, выборки из базы не происходит, хотя переменная передается...
Да, первый файл инклудом подключается основной части страницы, может скрипт аякса надо вставлять в начало именного того файла?
Спустя 2 минуты, 41 секунда (20.08.2009 - 14:41) SunSet написал(а):
Спустя 6 минут, 40 секунд (20.08.2009 - 14:48) glivera написал(а):
как я понял, проблема того, что при выборе у меня исчезает первая форма при выборе, это то что объекты находтся именно в одной формме... или нет?
убрал все дивы их формы, форма не исчезает, только свторой селект выскакивает теперь вверху страницы, переменная передается, но выборка из базы не делается(((
