[SOLVED] Dynamic Drop Down List Not Passing Correct Variable

[refiking]

Ok.  So, I am using a dynamic drop down list using a javascript file and the drop down list works perfectly in and of itself. It's function is to display the options of drop down list 2 based on the selection of the user on drop down list 1.  The problem I am having is when I try to run a db query, it is defining $_POST['SubCat'] as 'Color' instead of the color selected (blue for example).  How can I get this to work?  I'll post both the javasrcipt script and the php script.

 

Here's The Javascript

function fillCategory(){ 
// this function is used to fill the category list on load
addOption(document.drop_list.Category, "Color", "Color", "");
addOption(document.drop_list.Category, "Theme", "Theme", "");
addOption(document.drop_list.Category, "Price", "Price", "");
}

function SelectSubCat(){
// ON selection of category this function will work

removeAllOptions(document.drop_list.SubCat);
addOption(document.drop_list.SubCat, "Select Filter Type", "Select Filter Type", "");

if(document.drop_list.Category.value == 'Color'){
addOption(document.drop_list.SubCat,"Orange", "Orange");
addOption(document.drop_list.SubCat,"Blue", "Blue");
addOption(document.drop_list.SubCat,"Red", "Red");
}
if(document.drop_list.Category.value == 'Theme'){
addOption(document.drop_list.SubCat,"Professional", "Professional");
addOption(document.drop_list.SubCat,"Contemporary", "Contemporary");
addOption(document.drop_list.SubCat,"Elegant", "Elegant", "");
}
if(document.drop_list.Category.value == 'Price'){
addOption(document.drop_list.SubCat,"1", "9 Credits & Below");
addOption(document.drop_list.SubCat,"2", "10 - 19 Credits");
addOption(document.drop_list.SubCat,"3", "20 - 29 Credits");
addOption(document.drop_list.SubCat,"4", "30 Credits & Above");
}

}
////////////////// 

function removeAllOptions(selectbox)
{
var i;
for(i=selectbox.options.length-1;i>=0;i--)
{
	//selectbox.options.remove(i);
	selectbox.remove(i);
}
}


function addOption(selectbox, value, text )
{
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;

selectbox.options.add(optn);
}

 

And here's the php where I am having the trouble:

 

<FORM name="drop_list" action="tester.php" method="POST" >
<TD><input type="hidden" name="filter" value="yes">
<SELECT  NAME="Category" onChange="SelectSubCat();" >
<Option value="">Category</option>
</SELECT> 
</TD><TD><b>Only Show: </b></TD><TD><SELECT id="SubCat" NAME="SubCat">
<Option value="">Select Filter Type</option>
</SELECT></TD><TD><input type="submit" value="Filter Now"></TD></FORM>

[Slip]

Any chance of a cut'n'paste of the source html (view source) of the section near this dropdown list?

[refiking]

Here's the source code:

 

<FORM name="drop_list" action="tester.php" method="POST" >

<TD><input type="hidden" name="filter" value="yes">

<SELECT  NAME="Category" onChange="SelectSubCat();" >

<Option value="">Category</option>

</SELECT> 

</TD><TD><b>Only Show: </b></TD><TD><SELECT id="SubCat" NAME="SubCat">

<Option value="">Select Filter Type</option>

</SELECT></TD><TD><input type="submit" value="Filter Now"></TD></FORM>

[Slip]

How about some rendered output so we can see all the <option> tags...This is where I think you are possible having the problem see...

[refiking]

Not sure I understand, but here goes. Here's the code that stops the page from continuing here:

 

$value = $_POST['SubCat'];
$sl = mysql_query("SELECT * FROM `products` WHERE `$value` = 'yes'")or die(mysql_error());

 

I selected Color in the 1st Drop Down Box and Blue in the second drop down box, so it should render $_POST['subcat'] = blue.  Instead it renders $_POST['subcat'] = color.  As evidenced by the error message:

 

Unknown column 'Color' in 'where clause'

[Slip]

Sorry I'm not making myself clear...

 

What I mean is a sample of the rendered out put i.e. go to the url in a browser, view source and then cut and paste some of that. I got a sneaky suspicion that the Javascript you are using is not filling in the <option value=""> properly causing your php script to fail.

[refiking]

Yeah that's what I posted earlier.  That was the source code.

Here it is again, though.

<FORM name="drop_list" action="tester.php" method="POST" >
<TD><input type="hidden" name="filter" value="yes">
<SELECT  NAME="Category" onChange="SelectSubCat();" >
<Option value="">Category</option>
</SELECT> 
</TD><TD><b>Only Show: </b></TD><TD><SELECT id="SubCat" NAME="SubCat">
<Option value="">Select Filter Type</option>
</SELECT></TD><TD><input type="submit" value="Filter Now"></TD></FORM>

[Stryves]

What Slip is asking for is the HTML Source you see when the page is displayed, and you look at the source code from the browser.

 

Something is missing when it's being shown through the web most likely.

 

If that is the HTML Source from IE / Firefox, I'm just scanning the functions now.

 

[refiking]

Yeah. I know what he's talking about.  I copied this straight from the source code.  I opened the page, clicked view source and copied the section in question.  Then, I cut and pasted it here.  From what I'm gathering from you all's responses is this seems to be more of a javascript code problem.  Am I right in that assumption?

[Slip]

Ah right I do apologise, you won't actually see the additional output that the JS will add via the broswer view source method...

 

I do though believe it is a problem in the Javascript not setting the <select id or <option value correctly. This has got nothing to do with PHP though...

[refiking]

Can anyone recommend a javascript focused forum that is comparable in speed and intelligence as phpfreaks?

[refiking]

I found the problem in the javascript code. Here's what I changed it to:

if(document.drop_list.Category.value == 'Theme'){
addOption(document.drop_list.SubCat,"Professional", "Professional", "Professional");
addOption(document.drop_list.SubCat,"Contemporary", "Contemporary", "Contemporary");
addOption(document.drop_list.SubCat,"Elegant", "Elegant", "Elegant");

 

I needed to add another ,"" to the string.  Worked perfectly after that