[Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

how to pass a button value into CFC when an action is called in CF7

Posted on 2009-04-28
8
Medium Priority
?
445 Views
Last Modified: 2013-12-24
Hi i have a form with a submit type 'button' and submit type 'submit'. when my user clicks on save it simply calls the action and start processing. but when my user clicks on submit button then, an action is invoked by onclick (doCalc();) which has an alert message to press OK or CANCEL. if user clicks OK then it will submit the form (means it should call my action - CFC). my problem is when i click on OK, it does invokes my action cfc but, it cannot pass the value of a button to the action. so as soon as it calls the action, it just stops there.

only action i do two things. for example, if it's a submit type (not a button type) then it process a chunk of code to insert some data. and if user click on Submit button (button type) then it should process a different chunk of code. SEE CODE BELOW. you guys are always very helpful, thanks in advance.
<!--- THE FORM --->
<cfparam name="start_date" default="">
	<cfparam name="end_date" default=""> 
 
	<cfform name="addform" format="Flash" skin="haloOrange" height="400" width="780" action="components/actions.cfc?method=insertData&num=#session.sid#" onLoad="runOnLoad(); formOnLoad();">
		<cfformitem type="script">
	      function formOnLoad()
	      {
	         // Do anything that you need to do in the onload Event
	         
	         // call the function that is in charge of applying the styles
	
	         applyStyles();
	      }
	      function applyStyles()
			      {			       
			         _global.styles.Form.setStyle("color", 0x000000);
			         _global.styles.Panel.setStyle("backgroundColor", 0xE5F0F9);
			         _global.styles.Panel.setStyle("color", 0xffffff);<!--- font --->
			         _global.styles.Panel.setStyle("headerColors", [0x277DC6,0x0072A8]);
			         _global.styles.hdividedbox.setStyle("backgroundColor", 0x0072A8);
			         
			         
			      }
	   </cfformitem>
		<cfoutput>		
			<cfformitem type="script">
	                function runOnLoad() 
	                {
	                        var dateString = "#dateFormat(now(), 'yyyy-mm-dd')#";
	                        var startAfter = mx.formatters.DateFormatter.parseDateString(dateString);
	                        start_date.selectableRange={rangeStart: startAfter};    
							end_date.selectableRange={rangeStart: startAfter}; 
	                }
	        </cfformitem>
		</cfoutput>
		
		<cfoutput>	
			<cfformitem type="script">
			
        			// Used to submit the form when the OK button is clicked 
	       				 var delayedSubmitHandler = function(evt){
	       				 if(evt.detail == mx.controls.Alert.OK){
	       				 _root.submitForm();
	       				 }
	        			};
	 
	        			// Compare values in date fields
	        			function doCalc() 
	    			{
	    			
	       			 	var srtDate1 = start_date.text;
	        			var srtDate2 = end_date.text;
	        			var Date1 = mx.formatters.DateFormatter.parseDateString(srtDate1);
	        			var Date2 = mx.formatters.DateFormatter.parseDateString(srtDate2);
	        			<!--- datediff in millisecond --->
	        			var datediff=(Date2-Date1);
	        			<!--- convert datediff into days --->
	        			var diff=((datediff/8640000)/10);
	        			
	                if(diff==7)
	       	 			{
	                		alert("Important: You are requesting for a One week elective registration.DateDiff="+diff, "Warning", mx.controls.Alert.OK | mx.controls.Alert.CANCEL, delayedSubmitHandler);
							
	        			}
	        		else
	                	{
	               			alert("Are you sure to save this changes. DateDiff="+diff, "ALERT", mx.controls.Alert.OK | mx.controls.Alert.NO, delayedSubmitHandler);
	               			
 
	        			}
	        		}	        
        	</cfformitem>
	
		</cfoutput>
		
	<cfformgroup type="panel" label="ADD FORM" style="horizontalAlign:center">
	<cfoutput>
		<cfformgroup type="hdividedbox">	
			<cfformitem type="text" style="font-weight:bold;">Choose An Elective:</cfformitem>
			<!--- <cfformgroup type="horizontal"> --->
				
				<!--- hidden fields to insert on Structure --->
				<cfinput type="hidden" name="application_type" value="1">
				<cfinput type="hidden" name="completed" value="0">
				<cfinput type="hidden" name="Effective_Date" value="#DateFormat(Now(),"MM-DD-YYYY")# #TimeFormat(Now(), "hh:mm:ss tt")#">
				<cfinput type="hidden" name="lock_unlock" value="0">
				<cfinput type="hidden" name="ApplicantID" value="#session.sid#">
				<cfinput type="hidden" name="startAfterDate" value="#dateFormat(now(), 'yyyy-m-d')#">
				<!--- hidden inputs for comments --->
				<cfinput type="hidden" name="com_type" value="0">
				<cfinput type="hidden" name="date" value="#now()#">
				<cfinput type="hidden" name="appType" value="1">
				
				<cfselect name="elective" width="400" required="true" message="Please choose an elective">
					   		<option><!--- Select an Elective ---></option>
					<cfloop query="list">	      
					 	<cfoutput>
						 	<option value="#id#">#course_code# #course_number#, #title#</option>
						</cfoutput>
					</cfloop>
					
	   			</cfselect>
				
		<!--- 	</cfformgroup> --->
	  </cfformgroup>
		
	  		<cfformgroup type="hdividedbox">
		  		<cfformitem type="text" style="font-weight:bold;">Enter Date:</cfformitem>
	  	 		<cfinput type="dateField" name="start_date" label="Start Date" width="100" value="#start_date#" required="true" message="You must enter a Start Date.">
	  	 		<cfinput type="dateField" name="end_date" label="End Date" width="100" value="#end_date#" required="true" message="You must enter an End Date">
				<cfinput type="hidden" name="type" value="d">
			</cfformgroup>
			
			<cfformgroup type="hdividedbox">
				<cfformitem type="text" style="font-weight:bold;">Comments to Coordinator:</cfformitem>
				<cftextarea height="60" width="500" name="comments" label="Comments" id="comments" required="false"></cftextarea>
			</cfformgroup>
			
			<!--- <cfformgroup type="panel" label="CHOOSE AN INSTRUCTOR">
				<cfselect name="instructor" width="400" required="true">
				
					   	<option value="" selected="true"> Select an Instructor</option>
					<cfloop query="instructor">
	        	       		<cfoutput><option value="#id#">#first_name# #last_name#</option></cfoutput>				
					</cfloop>
	   			</cfselect>
			</cfformgroup> --->
			
		
			<cfformgroup type="horizontal" style="horizontalAlign:center" enabled="true">
				<cfinput type="submit" name="save" value="save" width="100">
				<cfinput type="button" name="apply" value="submit" width="100" onclick="doCalc();">
				<!--- <cfinput type="hidden" name="apply" value="apply">  --->
			</cfformgroup>
		</cfoutput>
		</cfformgroup> 
		
	</cfform>
 
 
<!--- THE ACTION --->
<cffunction name="insertData" hint="Inserts data only if you submit" access="remote" returntype="void">
<cfif IsDefined("form.apply") or IsDefined("form.save")> <!--- HERE IS THE PROBLEM STARTS --->
<!---   NO MATTER WHAT BUTTON THEY PRESS IT SHOULD CREATE A STRUCTURE WITH SOME HIDDEN VARIABLE IN THE FORM--->
 
<cfset session.myStruct = StructNew()>	
<cfset tmp = StructClear(session.myStruct)>
 
<!---ONCE THE STRUCTURE IS BUILD THEN IT SHOULD PROCESS SOME DATA INSERT BASED ON THE TYPE OF BUTTON PRESSED  --->
 
<cfif IsDefined("form.apply")> <!--- THIS DOESNT GET RECOGNIZED WHEN THE ACTION IS INVOKED BECAUSE cfinput type is button --->
 
[..........processs some data inser....................]
<cfelse>
[........................process data insert ..........]
 
</cfif>
 
 
</cfif>

Open in new window

0
Comment
Question by:khan02
  • 5
  • 2
8 Comments
 

Author Comment

by:khan02
ID: 24252290
just to let you know that my action is properly enclosed with </cffunction>, thats a typo posted above.
0
 
LVL 7

Expert Comment

by:60MXG
ID: 24252432
Why don't you try to change the

<cfinput type="button" name="apply" value="submit" width="100" onclick="doCalc();">

to

<cfinput type="submit" name="apply" value="submit" width="100" onclick="doCalc();">

and give it a try!
0
 

Author Comment

by:khan02
ID: 24253216
i did that before and what happens is, if the type is submit, then calling the function doCalc(); does not work properly (means my alert message doesn't wait for user to press Ok, or Cancel, it simply submits my form).

0
Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 7

Assisted Solution

by:60MXG
60MXG earned 80 total points
ID: 24253502
Maybe pass the parameters into doCalc() fucntion

something like this doCalc(x,y,z)

so it will be something like this

function doCalc(x,yz)
{
    ---- Your varidation code ---
     var w=window.open("components/actions.cfc?Date=" + x +"&Time=" + y + "&SomethingElse="+z,null);
}

The coding I have here has not been tested, I am only trying to show you what I would do for testing only!  The logic is there!
0
 

Author Comment

by:khan02
ID: 24254849
how do i make my code work, any other thoughts? i am new into action scripting.
0
 

Author Comment

by:khan02
ID: 24262139
i am still stuck. how do i pass my button value when it tries to submit the form. See updated code,
	
<cfform name="addform" format="Flash" skin="haloOrange" height="400" width="780" action="components/actions.cfc?method=insertData&num=#session.sid#" onLoad="runOnLoad(); formOnLoad();" method="post">
<cfoutput>	
			<cfformitem type="script">
			
        			// Used to submit the form when the OK button is clicked 
	       			var delayedSubmitHandler = function(evt){ 
	       				 if(evt.detail == mx.controls.Alert.OK){
	       				        				 
	       				<!---  if(doCalc(type)=="apply"){
	       				 	document.addform.apply="apply"; --->
	       					_root.submitForm();	
	       					<!--- }
	       				else{
	       					document.addform.save="save";
	       					_root.submitForm();	
	       				} --->
	       				  	       				 		
	       				 }
	       				
	        			};
	 
	        		
	        		function doCalc(type) 
	    			{
	    				
	       			 	var srtDate1 = start_date.text;
	        			var srtDate2 = end_date.text;
	        			var Date1 = mx.formatters.DateFormatter.parseDateString(srtDate1);
	        			var Date2 = mx.formatters.DateFormatter.parseDateString(srtDate2);
	        			<!--- datediff in millisecond --->
	        			var datediff=(Date2-Date1);
	        			<!--- convert datediff into days --->
	        			var diff=((datediff/8640000)/10);
	        	
		        	if(type=="apply"){
		                <!--- document.addform.apply=="apply";  --->
		                if(diff==7)
		       	 			{
		                		alert("Important: You are requesting for a One week elective registration.DateDiff="+diff, "Warning", mx.controls.Alert.OK | mx.controls.Alert.CANCEL, delayedSubmitHandler);
								
		        			}
		        		else
		                	{
		               			alert("Are you sure to save this changes. DateDiff="+type, "ALERT", mx.controls.Alert.OK | mx.controls.Alert.NO, delayedSubmitHandler);
		               			
	
		        			}
		        		if(datediff==0){
		        				var s = "<cfoutput>#jsStringValue#</cfoutput>";
								alert(s); 
								return false;
		        			}
		        		}
		        		else
		        		{
		        			<!---  document.addform.save=="save";  --->
		        			 if(diff==7)
		       	 			{
		                		alert("Important: You are requesting for a One week elective registration.DateDiff="+diff, "Warning", mx.controls.Alert.OK | mx.controls.Alert.CANCEL, delayedSubmitHandler);
								
		        			}
		        			else
		                	{
		               			alert("Are you sure to save this changes. DateDiff="+type, "ALERT", mx.controls.Alert.OK | mx.controls.Alert.NO, delayedSubmitHandler);
		               			
	
		        			}
		        			if(datediff==0){
		        				var s = "<cfoutput>#jsStringValue#</cfoutput>";
								alert(s); 
								return false;
	
		        			}
		        		}
		        			
	        		}	        
        	</cfformitem>
 
		</cfoutput>
 
 
<cfformgroup type="hdividedbox">
		  		<cfformitem type="text" style="font-weight:bold;">Enter Date:</cfformitem>
	  	 		<cfinput type="dateField" name="start_date" label="Start Date" width="100" value="#start_date#" required="true" message="You must enter a Start Date.">
	  	 		<cfinput type="dateField" name="end_date" label="End Date" width="100" value="#end_date#" required="true" message="You must enter an End Date">
				<cfinput type="hidden" name="type" value="d">
			</cfformgroup>
			
			<cfformgroup type="hdividedbox">
				<cfformitem type="text" style="font-weight:bold;">Comments to Coordinator:</cfformitem>
				<cftextarea height="60" width="500" name="comments" label="Comments" id="comments" required="false"></cftextarea>
			</cfformgroup>
			
			<!--- <cfformgroup type="panel" label="CHOOSE AN INSTRUCTOR">
				<cfselect name="instructor" width="400" required="true">
				
					   	<option value="" selected="true"> Select an Instructor</option>
					<cfloop query="instructor">
	        	       		<cfoutput><option value="#id#">#first_name# #last_name#</option></cfoutput>				
					</cfloop>
	   			</cfselect>
			</cfformgroup> --->
			
		
			<cfformgroup type="horizontal" style="horizontalAlign:center" enabled="true">
				<cfinput type="button" name="save" value="save" width="100" onclick="doCalc('save');"><!--- save --->
				<cfinput type="button" name="apply" value="submit" width="100" onclick="doCalc('apply');"><!--- apply --->
				
			</cfformgroup>
		</cfoutput>
		</cfformgroup> 
		
	</cfform>

Open in new window

0
 
LVL 27

Expert Comment

by:azadisaryev
ID: 24262186
try this:

1) add a hidden field to your form
2) in the code that runs after the user clicks "OK" in the alert box, add code to populate this hidden field with some value
3) in your cfc function check for the hidden field and its value instead of for form.apply

Azadi
0
 

Accepted Solution

by:
khan02 earned 0 total points
ID: 24262818
i found an alternate way, see code below!!!

<cfoutput>      
                  <cfformitem type="script">
                  
                          // Used to submit the form when the OK button is clicked
                               var delayedSubmitHandler = function(evt){
                                      if(evt.detail == mx.controls.Alert.OK){
                                           _root.submitForm();                   
                                      }
                                     
                                };
      
                          
                          function doCalc(type)
                            {
                                  
                                      var srtDate1 = start_date.text;
                                var srtDate2 = end_date.text;
                                var Date1 = mx.formatters.DateFormatter.parseDateString(srtDate1);
                                var Date2 = mx.formatters.DateFormatter.parseDateString(srtDate2);
                                <!--- datediff in millisecond --->
                                var datediff=(Date2-Date1);
                                <!--- convert datediff into days --->
                                var diff=((datediff/8640000)/10);
                    
                          if(type=="apply"){
                            document.addform.apply="apply";
                            if(diff==7)
                                            {
                                        alert("Important: You are requesting for a One week elective registration.DateDiff="+diff, "Warning", mx.controls.Alert.OK | mx.controls.Alert.CANCEL, delayedSubmitHandler);
                                                
                                      }
                                      
                                else if(datediff==0){
                                      var s = "<cfoutput>#jsStringValue#</cfoutput>";
                                          alert(s);
                                          return false;
                                          }
                                else
                                  {
                                             alert("Are you sure to save this changes. DateDiff="+type, "ALERT", mx.controls.Alert.OK | mx.controls.Alert.NO, delayedSubmitHandler);
                                             
      
                                      }
                                }
                                else
                                {
                                      document.addform.save="save";
                                       if(diff==7)
                                            {
                                        alert("Important: You are requesting for a One week elective registration.DateDiff="+diff, "Warning", mx.controls.Alert.OK | mx.controls.Alert.CANCEL, delayedSubmitHandler);
                                                
                                      }
                                      else if(datediff==0)
                                          {
                                                var s = "<cfoutput>#jsStringValue#</cfoutput>";
                                                alert(s);
                                                return false;
                                          }                                      
                                      else
                                  {
                                             alert("Are you sure to save this changes. DateDiff="+type, "ALERT", mx.controls.Alert.OK | mx.controls.Alert.NO, delayedSubmitHandler);
                                             
      
                                      }
                                      
                                }
                                      
                          }             
              </cfformitem>

            </cfoutput>
0

Featured Post

Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction A frequently used term in Object-Oriented design is "SOLID" which is a mnemonic acronym that covers five principles of OO design.  These principles do not stand alone; there is interplay among them.  And they are not laws, merely princ…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
This video teaches users how to migrate an existing Wordpress website to a new domain.
Learn how to set-up PayPal payment integration in your Wufoo form. Allow your users to remit payment through PayPal upon completion of your online form. This is helpful for collecting membership payments, customer payments, donations, and more.
Suggested Courses

868 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