Solved

OnChange help with my form

Posted on 2008-10-17
22
164 Views
Last Modified: 2012-06-27
I have a form below that I posted the code to.  There is two drop down boxes where the second one is dependent on the first one.  The problem is when you click an option from the first box it submits the form to get the contents for the second box.  Now I can't use the Form Action="GoToPage.CFM"

Anybody now how to get around this issue.  Just to let you know I don't know any JAVA Script if that's your answer.  Trying not to use it.
<form action="GoToPage.cfm" method="post" enctype="multipart/form-data" id="form2">

                          

                          <cfquery name="qumake" datasource="users">

                            SELECT *

                            FROM umake

                            ORDER BY make ASC

                           </cfquery>

                          

                            <table width="252" border="0">

                          <tr>

                                    <td width="31">Make</td>

                                    <td width="85"><br />

									<label>

                                      <select name="lmake" onchange="this.form.submit()">

                                      <option>Select Manufacter</option>

                                      <cfoutput query="qumake">

                                       <option value="#idmake#" <cfif isDefined('form.lmake')><cfif form.lmake eq "#idmake#">selected</cfif></cfif																					>>#make#</option>

     								  </cfoutput>

                                      </select>

                                    </label></td>

                                    <td width="122">&nbsp;</td>

                          </tr>

                                  <tr>

                                    <td>Model</td>

                                    <td>

                                    <cfquery name="qmodel" datasource="users">

                                    SELECT *

                                    FROM umodel,umake

                                    WHERE umodel.idumake = #page.lmake#

                                    GROUP BY umodel.idumodel

                                    

                                    </cfquery>

                                    

                                    <label>

                                     <select name="lmodel" required="yes" id="lmodel">

                                     <option>Select Model</option>

                                     <cfoutput query="qmodel">

                                     <option value="#idumodel#">#model#</option>

                                     </cfoutput>

                                     </select>

                                     </label>

                                     </cfif>

                                    </td>

                                    <td>

                                    <cfif isDefined("form2.lmodel")>

                                    <a href="upricelisting.cfm?recordid=<cfoutput>#lmodel#</cfoutput>">Search Model</a></td>

                                    </cfif>

                              </tr>

   </table>

                                                                              </form>

Open in new window

0
Comment
Question by:sonicimpulse
  • 11
  • 9
  • 2
22 Comments
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22741196
then try using ajax
0
 

Author Comment

by:sonicimpulse
ID: 22742549
What is ajax?
0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22742581
AJAX will allow you self submission without refreshing a page
read this
http://www.indiankey.com/cfajax/examples/list.htm
0
 

Author Comment

by:sonicimpulse
ID: 22742679
That example is way beyond me.  I'm very new to all of this.  There has to be a simple way to store the selection into a variable or something.  Getting involved with java script, ajax is beyond what I know.
0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22742763
why do you need action in the form ? Because after selecting the second drop down it will get you link anyway . ALso your form does not have the name

SO this will be invalid entry
<cfif isDefined("form2.lmodel")>
It shoud say
<form action="GoToPage.cfm" method="post" enctype="multipart/form-data" id="form2" name ="form2">

0
 

Author Comment

by:sonicimpulse
ID: 22742794
Here is the problem when set the form up the way you have it.  After I click the first drop down box it does the form action.  It goes to GoToPage.cfm.  Still does not help me
0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22742911
well then you need two forms
0
 

Author Comment

by:sonicimpulse
ID: 22743626
I'm trying to set this up with two forms.  I still can't figure out to pass the value of this drop down box to the next page.  Any help on how to do this with two forms would be greatly appreciated.
0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22743641
just pass it as form , variable

#form.lmake#
0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22743644
or via url
0
 

Author Comment

by:sonicimpulse
ID: 22743687
Here is the error I get when the new page loads

 Element LMODEL is undefined in FORM.
 
The error occurred in C:\ColdFusion8\wwwroot\automotive\upricelisting.cfm: line 43

41 : SELECT *
42 : FROM vehicles
43 : WHERE  model="#form.lmodel#">
44 : </cfquery>
45 :
0
Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

 
LVL 19

Expert Comment

by:erikTsomik
ID: 22743708
can you post you code that you have right now

0
 

Author Comment

by:sonicimpulse
ID: 22743811

This is the first page where the users picks the make and model of the vehcile
 
 
 

<cfif isDefined('form.lmake')>

                                  <cfset page.lmake = form.lmake>

                                </cfif>

                                  <form method="post" enctype="multipart/form-data" id="form2">

                                    <cfquery name="qumake" datasource="users">

                            SELECT *

                            FROM umake

                            ORDER BY make ASC

                            </cfquery>

                                    <table width="126" border="0">

                                      <tr>

                                        <td>Make</td>

                                        <td><br />

                                            <label>

                                            <select name="lmake" onchange="this.form.submit()">

                                              <option>Select Manufacter</option>

                                              <cfoutput query="qumake">

                                                <option value="#idmake#" <cfif isDefined('form.lmake')><cfif form.lmake eq "#idmake#">selected</cfif></cfif																					>>#make#</option>

                                              </cfoutput>

                                            </select>

                                          </label></td>

                                      </tr>

                                      <tr>

                                        <td>Model</td>

                                        <td><cfif isDefined('page.lmake')>

                                            <cfquery name="qmodel" datasource="users">

                                    SELECT *

                                    FROM umodel,umake

                                    WHERE umodel.idumake = #page.lmake#

                                    GROUP BY umodel.idumodel

                                    

                                    </cfquery>

                                    

                                   

                                            <label>

                                            <select name="lmodel" required="yes" id="lmodel">

                                              <option>Select Model</option>

                                              <cfoutput query="qmodel">

                                                <option value="#idumodel#">#model#</option>

                                              </cfoutput>

                                            </select>

                                            </label>

                                          </cfif>                                        </td>

                                      </tr>

                                    </table>

                                </form></td>

                            </tr>

                          </table></td>

                          <td width="74"><form action="umodelisting.cfm" id="form3" method="post">

                            <input type="submit" name="submit" id="submit" value="Submit" />

                                                    </form>

                          </td>

                        </tr>

                      </table>
 
 
 

THIS IS THE SECOND CALLED UMODELLISTING.CFM PAGE THAT HAS THE QUERY
 

<cfquery name="listallused" datasource="users">

SELECT *

FROM vehicles

WHERE  model="#url.idumodel#">

</cfquery>

Open in new window

0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22743977
try this


<cfif isDefined('form.lmake')>

                                  <cfset page.lmake = form.lmake>

                                </cfif>

                                  <form method="post" enctype="multipart/form-data" id="form2" name="form2" action="">

                                    <cfquery name="qumake" datasource="users">

                            SELECT *

                            FROM umake

                            ORDER BY make ASC

                            </cfquery>

                                    <table width="126" border="0">

                                      <tr>

                                        <td>Make</td>

                                        <td><br />

                                            <label>

                                            <select name="lmake" onchange="this.form.submit()">

                                              <option>Select Manufacter</option>

                                              <cfoutput query="qumake">

                                                <option value="#idmake#" <cfif isDefined('form.lmake')><cfif form.lmake eq "#idmake#">selected</cfif></cfif                                                                                                                                                                     >>#make#</option>

                                              </cfoutput>

                                            </select>

                                          </label></td>

                                      </tr>

                                      <tr>

                                        <td>Model</td>

                                        <td><cfif isDefined('page.lmake')>

                                            <cfquery name="qmodel" datasource="users">

                                    SELECT *

                                    FROM umodel,umake

                                    WHERE umodel.idumake = #page.lmake#

                                    GROUP BY umodel.idumodel

                                    

                                    </cfquery>

                                    

                                   

                                            <label>

                                            <select name="lmodel" required="yes" id="lmodel">

                                              <option>Select Model</option>

                                              <cfoutput query="qmodel">

                                                <option value="#idumodel#">#model#</option>

                                              </cfoutput>

                                            </select>

                                            </label>

                                          </cfif>                                        </td>

                                      </tr>

                                    </table>

                                </td>

                            </tr>

                          </table></td>

                          <td width="74">

                            <input type="submit" name="submit" id="submit" value="Submit" />

                                                    </form>

                          </td>

                        </tr>

                      </table>

 

 <cfif isDefined("form2.submit") and form2.submit eq "submit">

 	<cflocation url="pagename.cfm?idumodel=#form.lmodel#" addtoken="no">

 

 </cfif>

 

THIS IS THE SECOND CALLED UMODELLISTING.CFM PAGE THAT HAS THE QUERY

 

<cfquery name="listallused" datasource="users">

SELECT *

FROM vehicles

WHERE  model="#url.idumodel#">

</cfquery>

Open in new window

0
 

Author Comment

by:sonicimpulse
ID: 22744058
Still get the following error when I submit the form

 Element IDUMODEL is undefined in URL.  This is the second page.  The first page of code works correctly.
 
The error occurred in C:\ColdFusion8\wwwroot\automotive\upricelisting.cfm: line 43

41 : SELECT *
42 : FROM vehicles
43 : WHERE  model="#url.idumodel#">
44 : </cfquery>
45 :
0
 
LVL 19

Expert Comment

by:erikTsomik
ID: 22744118
do this
put this on you first page page
<cfdump var="#form#">
<cfdump var="#url#">

ANd this on the second page
<cfdump var="#form#">
<cfdump var="#url#">
0
 

Author Comment

by:sonicimpulse
ID: 22744199
If I put the submit button in the same form it does not resubmit the from with the correct data for the second drop down box.  Thats the first part of this code that needs fixed.
0
 
LVL 63

Accepted Solution

by:
Zvonko earned 500 total points
ID: 22751760
It is difficult to check queries when you do not have the tables but this should work:
<form action="GoToPage.cfm" method="post" enctype="multipart/form-data" id="form2">

                          

                          <cfquery name="qumake" datasource="users">

                            SELECT *

                            FROM umake

                            ORDER BY make ASC

                           </cfquery>

                          

                         <table width="252" border="0">

                          <tr>

                                    <td width="31">Make</td>

                                    <td width="85"><br />

                                     <label>

                                      <select name="lmake" onchange="this.form.submit()">

                                      <option>Select Manufacter</option>

                                      <cfoutput query="qumake">

                                       <option value="#idmake#" <cfif isDefined('form.lmake')><cfif form.lmake eq "#idmake#">selected</cfif></cfif                                                                                                                                                                      >>#make#</option>

                                      </cfoutput>

                                      </select>

                                     </label>

                                    </td>

                                    <td width="122"> </td>

                          </tr>

                                  <tr>

                                    <td>Model</td>

                                    <td>

<cfif isdefined("FORM.lmake") and FORM.lmake GT "" >

                                    <cfquery name="qmodel" datasource="users">

                                    SELECT *

                                    FROM umodel,umake

                                    WHERE umodel.idumake = #FORM.lmake#

                                    GROUP BY umodel.idumodel

                                    

                                    </cfquery>

                                    

                                    <label>

                                     <select name="lmodel" required="yes" id="lmodel" onChange="document.links.linkShow.style.display=(this.value)?'inline':'none';" >

                                     <option value="" >Select Model</option>

                                     <cfoutput query="qmodel">

                                     <option value="#idumodel#">#model#</option>

                                     </cfoutput>

                                     </select>

                                     </label>

<cfelse>

                                     Select Make first.

</cfif>

                                    </td>

                                    <td>

                                        <a name="linkShow" style="display:none;" href="upricelisting.cfm?recordid=" onClick="this.href+=document.form2.lmodel.value;">Search Model</a>

                                    </td>

                              </tr>

   </table>

</form>

Open in new window

0
 

Author Comment

by:sonicimpulse
ID: 22759065
ZVonko your code does not work because of the form action is sending the form to the second page. Then you have a line of code that reads onchange="this.form.submit()">

The user never gets to pick the model of the make because they our sent to the second page.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 22760166
Then change the action= attribute of the form:
<form action="" method="post" enctype="multipart/form-data" id="form2">

Open in new window

0
 

Author Comment

by:sonicimpulse
ID: 22760191
Not sure what that means to attribute of the form.  I did change it to action="" and I still get the same result
0
 

Author Comment

by:sonicimpulse
ID: 22760505
All I'm trying to do is get these drop down boxes to work and store the selection of the second box in a variable.  Can someone please help me with this.
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Suggested Solutions

I spent nearly three days trying to figure out how incorporate OAuth in Coldfusion for the Eventful API. Hopefully, this article will allow Coldfusion Programmers to buzz through the API when they need to. Basically, what this script does is authori…
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
Viewers will learn about basic arrays, how to declare them, and how to use them. Introduction and definition: Declare an array and cover the syntax of declaring them: Initialize every index in the created array: Example/Features of a basic arr…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now