I’ve been building this site that will get run an API depending on the search parameters. I used an if statement to determine the dropdown value. But for some reason the if statment doesn’t run. Is there something I am doing wrong please? Here’s the code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript"></script>
<title>Testing</title>
</head>
<body>
<form name="bestbuysearch">
<select name="selection" onchange="setvalue()">
<option value="default">Select Category(Optional)</option>
<option value="abcat0100000">TV & Home Theater</option>
<option value="abcat0207000">Musical Instruments</option>
<option value="abcat0300000">Car, Marine & GPS</option>
<option value="abcat0400000">Cameras & Camcorders</option>
<option value="abcat0500000">Computers & Tablets</option>
<option value="abcat0600000">Movies & Music</option>
<option value="abcat0700000">Video Games</option>
<option value="abcat0800000">Mobile Phones</option>
<option value="abcat0900000">Appliances</option>
<option value="pcmcat142300050026">Outlet Center</option>
<option value="pcmcat242800050021">Health, Fitness & Sports</option>
<option value="pcmcat245100050028">Office</option>
<option value="pcmcat248700050021">Home</option>
</select>
<input type='text' id="item" placeholder='Search Here!' style='margin-top: 10px' size="70" maxlength=150 width="100px" />
<input type='submit' value="Search" onclick="getstring(document.getElementById('item').value)"/>
</form>
<script>
function setvalue(){
dropval=document.getElementsByName("selection")[0];
maindropval=dropval.value;
}
function getstring(x){
//link="http://api.remix.bestbuy.com/v1/products(name="+x+"*)?show=sku,name,regularPrice&apiKey=ydpyq9h9cmpmzaakbawv9mzk";
//link2= "http://api.remix.bestbuy.com/v1/products(name=ipad|shortDescription=32gb*)?show=sku,name,shortDescription&apiKey=ydpyq9h9cmpmzaakbawv9mzk";
link1="http://api.remix.bestbuy.com/v1/products(name="+x+"*)?show=sku,name,regularPrice,shortDescription&apiKey=ydpyq9h9cmpmzaakbawv9mzk";
link2="http://api.remix.bestbuy.com/v1/products(categoryPath.id="+maindropval+"&name="+x+"*)?show=sku,name,shortDescription,regularPrice,&apiKey=ydpyq9h9cmpmzaakbawv9mzk";
if(maindropval=='default'){
alert("worked");
window.open(link1);}
else{
window.open(link2);}
}
function getresult(value){
link="http://api.remix.bestbuy.com/v1/products(name="+x+"*)?show=sku,name,rating,regularPrice&apiKey=ydpyq9h9cmpmzaakbawv9mzk";
alert("step 2 completed");
}
</script>
</body>
</html>
The reason that it’s not working is that the variable
maindropvalis only set when you change the selection in the dropdown.To get the value
"default"in the variable, you have to select something other than the first item in the dropdown, and then change back to the first item again.Set the initial value of the variable:
or run the function when the page has loaded to set the value:
(The second solution would preferrable if the browser remembers the form values from a previous selection. In that case the variable would be set from the remembered value for the dropdown.)