表示される州と都市の選択ボックスまたはテキストボックスに応じて、ユーザーが国を選択するフォームがあります。
国で が選択されている場合INDIA
は、選択ボックスに州と都市の選択を入力する必要があります。それ以外の場合は、都市と州のテキストボックスに書き込みます。私はそれを実装することができますが、それには2つの問題があります-
- 1つ目は、ユーザーが国のいずれかを選択すると、非表示の部分のためのスペースがあることです
- 2 番目のフォームは、インド以外の国についてのみ提出されます。
スクリプトとhtmlの問題は何ですか?以下はコードです -
<script type="text/javascript">
function loadbox()
{
//var cnty=document.getElementById('country').slected;
var x=document.getElementById("country1").selectedIndex;
var y=document.getElementsByTagName("option")[x].value;
if(y==22)
{
document.getElementById("selectbox").style.visibility = "visible";
document.getElementById("textbox4cnty").style.visibility = "hidden";
}
else {
document.getElementById("selectbox").style.visibility = "hidden";
document.getElementById("textbox4cnty").style.visibility = "visible";
}
}
</script>
html部分
<label for="country">COUNTRY</label>
<select id="country1" name="country1" onChange="loadbox()">
<option value="" selected="selected" />SELECT</option>
<?php
$sql="SELECT * FROM `country` ";
$result = mysql_query($sql);
while($row=mysql_fetch_array($result))
{
?>
<option value="<?php echo $row['country_id']; ?>">
<?php echo $row['country_name']; ?></option>
<?php
}
?>
<option value="others">Others</option>
</select>
<div id="selectbox" style="visibility:hidden">
<label for="State">STATE </label>
<select id="state1" name="state1"
onchange="getCity('select_city.php?state_id='+this.value)">
<option value="">SELECT</option>
<?php
$sql1="SELECT * FROM `state` ";
$result1 = mysql_query($sql1);
while($row1=mysql_fetch_array($result1))
{
?>
<option value="<?php echo $row1['state_id']; ?>">
<?php echo $row1['state_name']; ?></option>
<?php
}
?>
</select>
<label for="STREET">CITY </label>
<select id="city1" name="city1">
<option value="">select</option>
</select> <br/>
<div>
<div id="textbox4cnty" style="visibility:hidden">
<label for="State">STATE </label>
<input type="text" placeholder="STATE" name="state1" required><br />
<label for="STREET">CITY </label>
<input type="text" placeholder="CITY" name="city1" required><br />
</div>