Множественный вариант OnChange с PHP

Question

У меня есть следующий MySql таблицу:

id | type  | mark  | model | series | year 
1 worldwide NULL   NULL NULL  NULL 
2 1   Acura  NULL NULL  NULL 
3 1   2   NSX  NULL  NULL 
4 1   2   3  TunedUp 2000-2003 
5 1   2   3  & nbsp 2004-2005 

Я хотел бы создать отборный выбор из четырех этапов в зависимости друг от друга. Например, выберите Sports, второе поле выберите Acura, третье NSX и четвертое TunedUP (2000 - 2003) или & nbsp; (2004 - 2005).

Я нашел следующее решение с JavaScript ToolBox Dynamic Option List, но это показывает мне много значений NULL. Я ищу более простое решение. Я пробовал поиск в Интернете, но я не могу даже правильно описать свою проблему.

Answer 1

/* Create table country */ 
CREATE TABLE `country` (
    `id` tinyint(4) NOT NULL auto_increment, 
    `country` varchar(20) NOT NULL default '', 
    PRIMARY KEY (`id`) 
) 

/*create table state*/ 
CREATE TABLE `state` (
    `id` tinyint(4) NOT NULL auto_increment, 
    `countryid` tinyint(4) NOT NULL, 
    `statename` varchar(40) NOT NULL, 
    PRIMARY KEY (`id`) 
) 

/* Create table city */ 
CREATE TABLE `city` (
    `id` tinyint(4) NOT NULL auto_increment, 
    `city` varchar(50) default NULL, 
    `stateid` tinyint(4) default NULL, 
    `countryid` tinyint(4) NOT NULL, PRIMARY KEY (`id`) 
) 

Теперь, чтобы протестировать демонстрационную работу, мы должны добавить некоторые записи в каждую из таблиц. Поэтому для добавления записей выполните следующие запросы.

/* Inserting records into country table */ 
INSERT INTO `country` VALUES (1, 'USA'); 
INSERT INTO `country` VALUES (2, 'Canada'); 

/* Inserting records into state table */ 
INSERT INTO `state` VALUES (1, 1, 'New York'); 
INSERT INTO `state` VALUES (2, 1, 'Los Angeles'); 
INSERT INTO `state` VALUES (3, 2, 'British Columbia'); 
INSERT INTO `state` VALUES (4, 2, 'Torentu'); 

/* Inserting records into city table */ 
INSERT INTO `city` VALUES (1, 'Los Angales', 2, 1); 
INSERT INTO `city` VALUES (2, 'New York', 1, 1); 
INSERT INTO `city` VALUES (3, 'Toranto', 4, 2); 
INSERT INTO `city` VALUES (4, 'Vancovour', 3, 2); 

Теперь сделайте один файл index.php и вставьте код ниже.

<form method="post" action="" name="form1"> 
<center> 
<table width="45%" cellspacing="0" cellpadding="0"> 
    <tr> 
     <td width="75">Country</td> 
     <td width="50">:</td> 
     <td width="150"> 
     <select name="country" onChange="getState(this.value)"> 
<option value="">Select Country</option> 
<?php while ($row=mysql_fetch_array($result)) { ?> 
<option value=<?php echo $row['id']?>><?php echo $row['country']?></option> 
<?php } ?> 
    </select> 
    </td> 
</tr> 
<tr style=""> 
    <td>State</td> 
    <td width="50">:</td> 
    <td > 
<div id="statediv"> 
     <select name="state" > 
     <option>Select State</option> 
     </select> 
</div> 
    </td> 
</tr> 
<tr> 
    <td>City</td> 
    <td width="50">:</td> 
    <td > 
<div id="citydiv"> 
      <select name="city"> 
      <option>Select City</option> 

      </select> 

     </div> 

    </td> 

    </tr> 
    </table> 
</center> 
</form> 

В случае onChage страны выпадающий мы назвали GetState функция() в JavaScript. Какое изменение значений параметров State выпадает, давайте посмотрим на код функции getState().

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> 

<script type="text/javascript"> 
function getState(countryId) { 
    var strURL="findState.php?country="+countryId; 
    var req = getXMLHTTP(); 
    if (req) { 
    req.onreadystatechange = function() { 
    if (req.readyState == 4) { 
    // only if "OK" 
    if (req.status == 200) {  
     document.getElementById('statediv').innerHTML=req.responseText; 
     document.getElementById('citydiv').innerHTML='<select name="city">'+ 
     '<option>Select City</option>'+'</select>';  
    } else { 
     alert("Problem while using XMLHTTP:\n" + req.statusText); 
    } 
    }  
    } 
    req.open("GET", strURL, true); 
    req.send(null); 
    } 
} 
<script> 

Как вы можете видеть в коде выше мы передаем CountryId в файл findState.php, который заселить варианты в выпадающем списке состояния, которая извлекается из Ajax, приводится ниже.

<?php $country=intval($_GET['country']); 
$con = mysql_connect('localhost', 'root', ''); 
if (!$con) { 
    die('Could not connect: ' . mysql_error()); 
} 
mysql_select_db('test'); 
$query="SELECT id,statename FROM state WHERE countryid='$country'"; 
$result=mysql_query($query); 

?> 
<select name="state" onchange="getCity(<?php echo $country?>,this.value)"> 
<option>Select State</option> 
<?php while ($row=mysql_fetch_array($result)) { ?> 
<option value=<?php echo $row['id']?>><?php echo $row['statename']?></option> 
<?php } ?> 
</select> 

В приведенном выше коде для состояния выпадающего меню, функция getCity() вызывается на его onChage события, имеющего параметры CountryId и stateId, теперь давайте посмотрим на код функции getCity()

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> 

<script type="text/javascript"> 
    function getCity(countryId,stateId) { 
     var strURL="findCity.php?country="+countryId+"&state="+stateId; 
     var req = getXMLHTTP(); 

     if (req) { 

     req.onreadystatechange = function() { 
     if (req.readyState == 4) { 
     // only if "OK" 
     if (req.status == 200) {  
      document.getElementById('citydiv').innerHTML=req.responseText;  
     } else { 
      alert("Problem while using XMLHTTP:\n" + req.statusText); 
     } 
     }  
     } 
     req.open("GET", strURL, true); 
     req.send(null); 
     } 

    } 

Как вы можете видеть в приведенной выше функции ajax, вызывается один файл findcity.php, и этот файл PHP заполняет раскрывающийся список города в соответствии с предоставленными параметрами страны и состояния из метода get. Теперь давайте посмотрим на код findcity.php,

<?php 
$countryId = intval($_GET['country']); 
$stateId = intval($_GET['state']); 
$con  = mysql_connect('localhost', 'root', ''); 

if (!$con) { 
    die('Could not connect: ' . mysql_error()); 
} 

mysql_select_db('test'); 
$query="SELECT id,city FROM city WHERE countryid='$countryId' AND stateid='$stateId'"; 
$result=mysql_query($query); 

?> 
<select name="city"> 
<option>Select City</option> 
<?php while($row=mysql_fetch_array($result)) { ?> 
<option value=<?php echo $row['id']?>><?php echo $row['city']?></option> 
<?php } ?> 
</select>