form not passing variable

Dev Shed Forums Sponsor:

June 15th, 2005, 09:36 AM

mkm

Contributing User

Join Date: Jun 2004

Posts: 104

Time spent in forums: 20 h 51 m 53 sec
Reputation Power: 5

form not passing variable

Hi all,

I recently got some help from the HTML programming section on creating a dependent dropdown list - that is, choosing an item from one select menu would cause a particular 2nd select menu to appear. The good folks in that thread helped me with a javascript bit that I had found (I really don't know any javascript). That thread is here: http://forums.devshed.com/t262187/s.html

Anyway, it works great but the item chosen in the 2nd dropdown (select menu) does not get passed to the action page when the form is submitted.

Here is my setup:

Table 1 = State (6 states listed)
Table 2 = Station, State (>100 stations listed)

Purpose: when a state is selected from the first dropdown (populated by table 1) fill the 2nd dropdown with those stations that have a matching state.

Here is a bit of my code on the form:

PHP Code:


		
			
<cfquery name="q_stationOR" datasource="PLOG">

SELECT StationName

FROM dbo.VS_Station

WHERE State='OR'

ORDER BY StationName ASC

</cfquery>

<cfquery name="q_stationWA" datasource="PLOG">

SELECT StationName

FROM dbo.VS_Station

WHERE State='WA'

ORDER BY StationName ASC

</cfquery>

<!--  repeated for the other four states -->





<!-- first dropdown -->

      <td><select name="state" onChange="DropDown();">

          <option value=""></option>

          <cfoutput query="q_state">

            <option value="#q_state.State#">#q_state.State#</option>

          </cfoutput>

        </select>

          <input type="hidden" name="state_required" value="Please choose a state">

      </td>





<!-- second dropdown -->

          <div id="hiddenOR" style="display:none;">

            <select name="stationOR" id="stationOR">

              <cfoutput query="q_stationOR">

                <option value="#q_stationOR.StationName#">#q_stationOR.StationName#</option>

              </cfoutput>

            </select>

          </div>

          <div id="hiddenWA" style="display:none;">

            <select name="stationWA" id="stationWA">

              <cfoutput query="q_stationWA">

                <option value="#q_stationWA.StationName#">#q_stationWA.StationName#</option>

              </cfoutput>

            </select>

          </div>

<!-- repeated for four other states -->



          <script type="text/javascript">

        if(document.all && !document.getElementById) { // for IE4 support

          document.getElementById = function(id) { return document.all[id]; }

        }

        function DropDown(){

          var sel = document.addjob.state;

          var val = sel.options[sel.selectedIndex].value;

          var hiddenCA = document.getElementById('hiddenCA');

          var hiddenHI = document.getElementById('hiddenHI');

          var hiddenID = document.getElementById('hiddenID');

          var hiddenNV = document.getElementById('hiddenNV');

          var hiddenOR = document.getElementById('hiddenOR');

          var hiddenWA = document.getElementById('hiddenWA');



          hiddenCA.style.display = "none";

          hiddenHI.style.display = "none";

          hiddenID.style.display = "none";

          hiddenNV.style.display = "none";

          hiddenOR.style.display = "none";

          hiddenWA.style.display = "none";



          switch(val) {

            case "CA": hiddenCA.style.display = "block"; break;

            case "HI": hiddenHI.style.display = "block"; break;

            case "ID": hiddenID.style.display = "block"; break;

            case "NV": hiddenNV.style.display = "block"; break;

            case "OR": hiddenOR.style.display = "block"; break;

            case "WA": hiddenWA.style.display = "block"; break;

          }

        }

        </script>

Now here is the code I have on my action page

PHP Code:


		
			
<cfif IsDefined("FORM.stationCA") AND #FORM.stationCA# NEQ "">

    '#FORM.stationCA#'

      <cfelseif IsDefined("FORM.stationHI") AND #FORM.stationHI# NEQ "">

        '#FORM.stationHI#'

      <cfelseif IsDefined("FORM.stationID") AND #FORM.stationID# NEQ "">

        '#FORM.stationID#'

      <cfelseif IsDefined("FORM.stationNV") AND #FORM.stationNV# NEQ "">

        '#FORM.stationNV#'

      <cfelseif IsDefined("FORM.stationOR") AND #FORM.stationOR# NEQ "">

        '#FORM.stationOR#'

      <cfelseif IsDefined("FORM.stationWA") AND #FORM.stationWA# NEQ "">

        '#FORM.stationWA#'

      <cfelse>

          NULL

  </cfif>

No matter what I choose from the second dropdown the very first item in the station list gets submitted every time.

Can anyone recognize what I"m doing wrong? Sorry for the long spout of code!

melissa

June 15th, 2005, 09:58 AM

kiteless

Moderator

Join Date: Jun 2002

Location: Raleigh, NC

Posts: 3,655

Time spent in forums: 1 Week 4 Days 13 h 29 m 8 sec
Reputation Power: 53

I'm pretty sure its a problem with your Javascript code. You might want to post it to the Javascript forum if no one here can give a good answer.

__________________
Ask if you have a question, but also help answer questions that you have knowledge of! Thanks, Brian.
How to Post a Question in the Forums

June 15th, 2005, 10:07 AM

mkm

Contributing User

Join Date: Jun 2004

Posts: 104

Time spent in forums: 20 h 51 m 53 sec
Reputation Power: 5

I guess I was wondering if I was passing the right variable? And if the code on the submit page is correct?

I think the JS is okay since the form works like it's supposed to. But if no one here can help I'll give a shout over in the other forum.

Thanks!

melissa

June 15th, 2005, 11:26 AM

kiteless

Moderator

Join Date: Jun 2002

Location: Raleigh, NC

Posts: 3,655

Time spent in forums: 1 Week 4 Days 13 h 29 m 8 sec
Reputation Power: 53

On the action page do a <cfdump var="#form#"><cfabort> and see if the variable you think should be in the form scope is actually there and what its value is.

June 15th, 2005, 12:16 PM

mkm

Contributing User

Join Date: Jun 2004

Posts: 104

Time spent in forums: 20 h 51 m 53 sec
Reputation Power: 5

Cool! I never used that before.

I figured out what was happenning - because there was no blank line at the top of each dropdown every form variable (stationCA, stationID, stationHI, etc) was passing something. Once I put in a blank option before outputting the query it was fine!

In other words, the form needed the bold line for every select dropdown:

PHP Code:


		
			
<div id="hiddenHI" style="display:none;">

            <select name="stationHI" id="stationHI">

               [B] <option value=""></option>[/B]

              <cfoutput query="q_stationHI">

                <option value="#q_stationHI.StationName#">#q_stationHI.StationName#</option>

              </cfoutput>

            </select>

          </div>

Thanks (again and again) kiteless! I learn something new from you every time.

Cheers,
melissa

June 15th, 2005, 12:43 PM

kiteless

Moderator

Join Date: Jun 2002

Location: Raleigh, NC

Posts: 3,655

Time spent in forums: 1 Week 4 Days 13 h 29 m 8 sec
Reputation Power: 53

That tip as well as some others are in the sticky threads at the top of the CF forum! Give them a look.

June 15th, 2005, 01:16 PM

mkm

Contributing User

Join Date: Jun 2004

Posts: 104

Time spent in forums: 20 h 51 m 53 sec
Reputation Power: 5

Will do - sorry I didn't before!

May I ask one more question? This might actually belong back in the html programming forum, or maybe even javascript but what the heck, it's worth a shot . . .

The guy I'm building this form for wants the station field to be required. When I try to use the hidden variable I get the "field is required" message even when I choose something. Why is that?

I have this below the javascript from above:

Code:

<input type="hidden" name="station_required" value="Please choose a station or division">

June 15th, 2005, 01:39 PM

Bastion

Contributing User

Join Date: Oct 2004

Posts: 181

Time spent in forums: 2 Days 4 h 23 m 47 sec
Reputation Power: 4

Quote:

Originally Posted by mkm

The guy I'm building this form for wants the station field to be required. When I try to use the hidden variable I get the "field is required" message even when I choose something. Why is that?

I have this below the javascript from above:

Code:

<input type="hidden" name="station_required" value="Please choose a station or division">

Looking at the code in the thread above, you don't have a field with name="station" unless of course that's changed in your code. To get the hidden required field, the name must be the same as an actual field in existence + "_required"

June 15th, 2005, 01:54 PM

mkm

Contributing User

Join Date: Jun 2004

Posts: 104

Time spent in forums: 20 h 51 m 53 sec
Reputation Power: 5

Doh! You are right! I completely missed that!

So how would I code it for these multiple select statements? Really just one value is required. Do I need an if/else statement?

#10

June 17th, 2005, 08:27 AM

Bastion

Contributing User

Join Date: Oct 2004

Posts: 181

Time spent in forums: 2 Days 4 h 23 m 47 sec
Reputation Power: 4

Quote:

Originally Posted by mkm

Doh! You are right! I completely missed that!

So how would I code it for these multiple select statements? Really just one value is required. Do I need an if/else statement?

I'm not sure what you are asking. Do you mean how you code for the hidden field on the front end? Or something else on the processing end?

Thread Tools	Search this Thread
Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread: