Member Avatar for thijscream

hi,
i'm having the following problem, normaly i work with html css and php but for this to work i need to make a litle javascript function and i'm still kinda new to it. so here is my problem.
i'm making a search field where someone has to select some radiobuttons.
first it has a selection out of 4 items and then a selection out of like 20 but how do i get the value from the first function in the second?

in this case i would like to have the following in function showStreek:
xmlhttp.open("GET","test3.php?l="+land,true);
this line should look like:
xmlhttp.open("GET","test3.php?k="+kleur"l="+land,true);
or something like that'.
what in fact i want to do is send 2 variables but i don't know how to do this.
can anyone explain this to me?

function showLand(kleur)
{
if (kleur=="")
  {
  document.getElementById("txtland").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtland").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","test2.php?k="+kleur,true);
xmlhttp.send();
}


function showStreek(land)
{
if (land=="")
  {
  document.getElementById("txtstreek").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtstreek").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","test3.php?l="+land,true);
xmlhttp.send();
}
  • 3 Contributors
  • 5 Replies
  • 115 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Graphix
Member Avatar for twiss

You need to seperate key/value pairs with an & .

Member Avatar for thijscream

yeah i know that(was a typo), that's not exactly what i'm asking. how can i use the var kleur in the 2nd function is the correct question

Member Avatar for twiss

Oh, sorry. I'm not sure if I understand this correctly, but you can pass multiple variables in a function:

function show(kleur, land) {
 ...
}
...
show('rood-wit-blauw', 'nederland');
Member Avatar for thijscream

yeah i know i can do that. just this is my entire script:

<?php
include "header.php";
?>
<html>
<head>
<script type="text/javascript">
for( i = 0; i < document.search.land.length; i++ )
{
if( document.myform.mygroup[i].checked == true )
val = document.myform.mygroup[i].value;
}
alert( "val = " + val );


function showLand(kleur)
{
if (kleur=="")
  {
  document.getElementById("txtland").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtland").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","test2.php?k="+kleur,true);
xmlhttp.send();
}


function showStreek(land)
{
if (land=="")
  {
  document.getElementById("txtstreek").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtstreek").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","test3.php?l="+land,true);
xmlhttp.send();
}


function showSubstreek(streek)
{
if (streek=="")
  {
  document.getElementById("txtsubstreek").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtsubstreek").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","test4.php?s="+streek,true);
xmlhttp.send();
}
</script>
</head>
<body>
<h1>Geavanceerd zoeken</h1>
<br><br><br><br>
<form action="advsearchresult.php" method="POST" id="search1" name="search1">

<div>
	<table>
<?php
$query = "SELECT DISTINCT kleur FROM wijnen limit 4";
$result = mysql_query($query) or die('Error : ' . mysql_error());
while(list($kleur) = mysql_fetch_array($result, MYSQL_NUM))
	{
?>	
	<td width="150">
		<input type="radio" name="kleur" value="<?php echo $kleur;?>" onchange="showLand(this.value)"><?php echo $kleur;?>
	</td>
<?php
	}
?>
	</table>
	<hr width="95%" align="left">
</div>

<br />
<div id="txtland"><b></b></div>
<div id="txtstreek"><B></b></div>
<div id="txtsubstreek"><B></b></div>

<table>
	<tr>
		<td>
			Prijs
		</td>
	</tr>
	<tr>
		<td>
			<input type="radio" name="prijs" value="1">< €10
		</td>
	</tr>
	<tr>
		<td>
			<input type="radio" name="prijs" value="2">€10 - €20
		</td>
	</tr>
	<tr>
		<td>
			<input type="radio" name="prijs" value="3">€20 - €30
		</td>
	</tr>
	<tr>
		<td>
			<input type="radio" name="prijs" value="4">€30 - €40
		</td>
	</tr>
	<tr>
		<td>
			<input type="radio" name="prijs" value="5">> €40
		</td>
	</tr>
	
</table>
</form>
</body>
</html>

might make it more easy to read it.
so for every click on a radiobutton i read a new php file what gives me some extra's to choose from. and for every click i have a different function called. is there a way to make this work?
on the pages i include with the javascript i have different mysql queries and i want to parse more variables to it then just 1.

Member Avatar for Graphix

Hi,

In your code you defined that there are three variables needed to search for wine:

- The color of the wine (e.g. red, white, or something like that), which I think is not really relevant but whatever
- The country of origin, or more specifically a region
- The price range

You can make a initial search bar that only covers the basic input:

Color: [________[>] Country: [________[>]

Then when either one of them is changed, a function is called, let's say RetrieveWinesOne():

- Retrieves the values of the color and country input
- Send a request to a PHP page to retrieve the wines matching the color and country

You can send multiple variables using the GET method:

xmlhttp.open("GET", "test3.php?k=" + kleur + "&l=" + land, true);

- Echo the returned HTML of the PHP page (preferably a table of some sort)

When this all is working, you should think about what the script needs to do furthermore, as the initial search bar contains only the primary variables needed to search wines and can be expanded with secundary variables such as the region in the selected country and the price range.

~G

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.