1 Replies - 805 Views - Last Post: 16 January 2009 - 12:44 PM

#1 jason-pc  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 61
  • Joined: 10-January 09

selecting option on menu A changes the options available in menu B

Posted 16 January 2009 - 12:31 PM

Please can someone help me here as i have no idea what i need to do or where to start.

this is the method i as trying to do...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form name="form2" method="post" action="">
  <p>
	<select name="select1">
	  <option value="L1 - VALUE 1">L1 - OPT 1</option>
	  <option value="L1 - VALUE 2">L1 - OPT 2</option>
	  <option value="L1 - VALUE 3">L1 - OPT 3</option>
	</select>
  </p>




<? // if OPT 1 is selected in the select1 pulldown then the following is placed the select2 options ?>
  <p>
	<select name="select2-1">
	  <option value="L2 - VALUE 1">L2 - OPT 1</option>
	  <option value="L2 - VALUE 2">L2 - OPT 2</option>
	  <option value="L2 - VALUE 3">L2 - OPT 3</option>
	</select>
  </p>




<? // if OPT 2 is selected in the select1 pulldown then the following is placed the select2 options ?>
  <p>
	<select name="select2-2">
	  <option value="L3 - VALUE 1">L3 - OPT 1</option>
	  <option value="L3 - VALUE 2">L3 - OPT 2</option>
	  <option value="L3 - VALUE 3">L3 - OPT 3</option>
	</select>
  </p>




<? // if OPT 3 is selected in the select1 pulldown then the following is placed the select2 options ?>
  <p>
	<select name="select2-3">
	  <option value="L4 - VALUE 1">L4 - OPT 1</option>
	  <option value="L4 - VALUE 2">L4 - OPT 2</option>
	  <option value="L4 - VALUE 3">L4 - OPT 3</option>
	</select>
  </p>
</form>
</body>
</html>


i have ben given this code to use but it does not allow me to get the data on the fly from the mysql database for each of the 'topic' title.

<script type="text/javascript">
window.addEventListener?window.addEventListener('load',function(){
	ray.init();
},false):window.attachEvent('onload',function()	{
	ray.init();
}); // FF: IE
	
var ray={
	clone:'',
	
	init:function(){
		var opt = document.form2.select1; // Select1 dropdown
		var clone = document.form2.select2; // Select2 dropdown
		this.clone=this.clone==''?clone:this.clone;
		opt.onchange=function(){
			ray.setOpt(this.value=='L1 - VALUE 3'?4:this.value=='L1 - VALUE 2'?3:2);
		}
	},

	setOpt:function(base){
		var HTML='';
		for(var i=1;i<=3;i++)
			HTML+='<option value="L'+base+'" - VALUE '+i+'>L'+base+' - OPT '+i+'</option>';
		ray.clone.innerHTML=HTML;
	}
}
</script>
<form name="form2" method="post" action="">
  <p>
	<select name="select1">
	  <option value="L1 - VALUE 1">L1 - OPT 1</option>
	  <option value="L1 - VALUE 2">L1 - OPT 2</option>
	  <option value="L1 - VALUE 3">L1 - OPT 3</option>
	</select>
  </p>

  <p>
	<select name="select2">
	  <option value="L3 - VALUE 1">L3 - OPT 1</option>
	  <option value="L3 - VALUE 2">L3 - OPT 2</option>
	  <option value="L3 - VALUE 3">L3 - OPT 3</option>
	</select>
  </p>
</form>






this is the code that gets the data from my mysql database and displays on the page but i need to have it so the top menu changes the options available in the bottom menu list and this new list is got from the database on change.

<select name="categoryid"><? // get category_id
$get_category_titles = mysql_query("SELECT * FROM `forum_category` WHERE `confirmed` = '1' ORDER BY `created_on` DESC");
$get_topic_titles = mysql_query("SELECT * FROM `forum_topics` WHERE `confirmed` = '1' ORDER BY `created_on` DESC");

for ($i = 0; $i < mysql_num_rows($get_category_titles); $i ++) { ?><option<?
if ($posts['categoryid'] == mysql_result($get_category_titles, $i, 'category_id')) {echo(" selected");} ?> value="<?=mysql_result($get_category_titles, $i, 'category_id');?>"><?=mysql_result($get_category_titles, $i, 'category');?></option><?
} ?></select>


<select name="topicid"><? // get topics
for ($i = 0; $i < mysql_num_rows($get_topic_titles); $i ++) {
?><option<? if ($posts['topicid'] == mysql_result($get_topic_titles, $i, 'topic_id')) {echo(" selected");}
?> value="<?=mysql_result($get_topic_titles, $i, 'topic_id');?>"><?=mysql_result($get_topic_titles, $i, 'topic');?></option><?
} ?></select>

This post has been edited by jason-pc: 16 January 2009 - 12:34 PM


Is This A Good Question/Topic? 0
  • +

Replies To: selecting option on menu A changes the options available in menu B

#2 William_Wilson  Icon User is offline

  • lost in compilation
  • member icon

Reputation: 205
  • View blog
  • Posts: 4,807
  • Joined: 23-December 05

Re: selecting option on menu A changes the options available in menu B

Posted 16 January 2009 - 12:44 PM

You are not going to be able to use php within the page to handle the "on the fly" call without reloading the page or using an iframe.
You would be best to use an AJAX call to a php file, which could get and respond with the select code.

There is a tutorial on a php chatbox that should get you started on how to use ajax and php together: http://www.dreaminco...wtopic44808.htm
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1