Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

ReCaptcha: how to keep information after form refreshes

Status
Not open for further replies.

olchik

Programmer
Jan 6, 2006
93
US
Hello,

I am trying to add ReCaptcha to my form. If someone enters wrong words or nothing at all in reCaptcha field, form refreshes itself. Everything is working fine, except two dynamic fields. I have two fields that appear if someone selects certain selection from dropdowns. I was able to display all the information entered (after form refreshes), except those dynamic fields. Does anyone know how to do it?

Thank you
 
Hello, thank you for your response!

Here is the code

<select id="feedbacktype" name="feedbacktype" onChange="ShowReg2(this.selectedIndex)">
<option value='0'> -- select--
<option value="Report a bug" <cfif IsDefined("form.recaptcha")>
<cfif #form.recaptcha# is false><cfif IsDefined("form.feedbacktype")><cfif #form.feedbacktype# is "Report a bug">selected</cfif></cfif></cfif></cfif>> Report a bug</option>
<option value="Complaint" <cfif IsDefined("form.recaptcha")>
<cfif #form.recaptcha# is false><cfif IsDefined("form.feedbacktype")><cfif #form.feedbacktype# is "Complaint">selected</cfif></cfif></cfif></cfif>> Complaint</option>
<option value="Compliment" <cfif IsDefined("form.recaptcha")>
<cfif #form.recaptcha# is false><cfif IsDefined("form.feedbacktype")><cfif #form.feedbacktype# is "Compliment">selected</cfif></cfif></cfif></cfif>> Compliment</option>
<option value="Comment" <cfif IsDefined("form.recaptcha")>
<cfif #form.recaptcha# is false><cfif IsDefined("form.feedbacktype")><cfif #form.feedbacktype# is "Comment">selected</cfif></cfif></cfif></cfif>> Comment</option>
<option value="Question" <cfif IsDefined("form.recaptcha")>
<cfif #form.recaptcha# is false><cfif IsDefined("form.feedbacktype")><cfif #form.feedbacktype# is "Question">selected</cfif></cfif></cfif></cfif>> Question</option>
</select>
<br><div id="Report a bug" style="display:none">
<font face="Verdana, Arial, Helvetica, sans-serif"size="2">What computer platform are you using?</font>
<input type="text" name="Comptype" <cfif IsDefined("form.recaptcha")>
<cfif #form.recaptcha# is false><cfif IsDefined("form.Comptype")>value="#form.Comptype#"</cfif></cfif><cfelse>value=""</cfif>></div>
<div id="Complaint" style="display:none">
<input type="hidden" name="Complaint" value=""></div>
<div id="Compliment" style="display:none">
<input type="Hidden" name="Compliment" value=""></div>
<div id="Comment" style="display:none">
<input type="hidden" name="Comment" value=""></div>
<div id="Question" style="display:none">
<input type="hidden" name="Question" value=""></div>
 
onChange="ShowReg2(this.selectedIndex)"

Can you post that function?

Having nothing to do with your problem.. using CFPARAM would greatly simplify your code. Declare a default for all FORM values. So they always exist. Then you can use them normally, without all the nested CFIF's statements.

Code:
<cfparam name="form.feedbacktype" default="">
<cfparam name="form.Comptype" default="">
...
<select id="feedbacktype" name="feedbacktype" onChange="ShowReg2(this.selectedIndex)">
   <option value='0'> -- select--
   <option value="Report a bug" <cfif form.feedbacktype is "Report a bug">selected</cfif>> Report a bug</option>
   <option value="Complaint" <cfif form.feedbacktype is "Complaint">selected</cfif>> Complaint</option>
   ... etcetera ....
</select>
... html ....
<input type="text" name="Comptype" value="#form.Comptype#">
... etcetera ...


----------------------------------
 
Thank you again! Here is the function

function ShowReg2(op) {
document.getElementById('Report a bug').style.display='none';
document.getElementById('Complaint').style.display='none';
document.getElementById('Compliment').style.display='none';
document.getElementById('Comment').style.display='none';
document.getElementById('Question').style.display='none';

if (op == 1) {
document.getElementById('Report a bug').style.display="block";
}
if (op == 2) {
document.getElementById('Complaint').style.display="block";
}
if (op == 3) {
document.getElementById('Compliment').style.display="block";
}
if (op == 4) {
document.getElementById('Comment').style.display="block";
}
if (op == 5) {
document.getElementById('Question').style.display="block";
}
}
 
I am not good at JavaScript:-( I don't know how to to that
 
AjaxOnLoad is not a javascript function, it is CF. Granted it does invoke a javascript function.

Code:
<cfjaximport />
... other html/cf code ...
<cfset AjaxOnLoad("YourJavascriptFunctionName")>

The one catch is it does not accept parameters. Write a wrapper function that calls your javascript function ShowReg2(op)

Code:
<cfjaximport />
<script ..>
    function ShowReg2(op) {
       //.... more code 
    }
    function init() {
       //... get the selected list index and 
       // pass it into ShowReg2(..)
    } 
</script>
... other html/cf code ...
<cfset AjaxOnLoad("init")>


That said, that is not the most efficient way to structure the code. The form and javascript could certainly be simplified. But understand what the code is doing first. Then refactor it.


----------------------------------
 
Hello,

Thank you for your response. I was away for last 2 weeks.
Getting back is not easy and I have to say I don't understand anything. Is there any other way to retain value when form refreshes?

Thank you
 
Retaining values is easy. Like I said earlier, use cfparam to set a default value for all form fields. Then set the initial value of your fields.

Code:
<cfparam name="form.Comptype" default="">
<input type="text" name="Comptype" value="#form.Comptype#">

But that is not what your javascript function is doing. It toggles the visibility of certain html elements with javascript. What part is not clear? The outline is already there. All you need is one more line of code.

ie //... get the selected list index and
// pass it into ShowReg2(..)

----------------------------------
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top