• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Preview form input

Explorer ,
Sep 18, 2008 Sep 18, 2008

Copy link to clipboard

Copied

Can anyone tell of a not too advanced way of enabling users to preview the question that they have filled in the Question textarea field before they submit the form? I would like it to work similar to clicking the preview button in this forum. thanks

jim
TOPICS
Advanced techniques

Views

1.0K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 18, 2008 Sep 18, 2008

Copy link to clipboard

Copied

Do something to bring up the preview button. Look at the page source and see what it does.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 18, 2008 Sep 18, 2008

Copy link to clipboard

Copied

I looked but i still do not get how the content of the message field is passed from the form to the preview page.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 18, 2008 Sep 18, 2008

Copy link to clipboard

Copied

rockhiker wrote:
> I looked but i still do not get how the content of the message field is passed from the form to the preview page.

Unless Adobe has updated the functionality in the years since I have
used the web interface...

It is done by passing it on a form submit...

There is nothing secret about a preview page. It is just the action
page of the *first* form. This action preview page displays the
contents of the first form submission and then builds a *second* form
with all the data from the first form in <input type="hidden"...> fields.

When the users selects the submit button on the preview page to accept
the data this second form is transported to the next action page which
actually process the received form fields into a database or whatever is
desired for this information.

With modern DHTML, AJAX and|or FLEX technologies, there maybe ways to
make this old school user interface slicker looking. But that is the
basic idea.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 18, 2008 Sep 18, 2008

Copy link to clipboard

Copied

Thanks for the reply - I am new at CF and I know how to create a form and submit data to an action page but I think this might be a bit beyond my skills so far.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 18, 2008 Sep 18, 2008

Copy link to clipboard

Copied

it is really simple, like Ian said.

on your form's action page, assuming you use method="post" for your
form, all form fields' values are available in the FORM scope. so if you
had a field named question (<input type="text" name="question" ...>) on
the action page you can access its value via #form.question#.

you intermediary (preview) action page should create a form with all
hidden fields to store all data passed from the original form. the
easiest way to do it is to loop over the #form# collection or
#form.fieldnames# list (which is a comma-delimited list of all field
names from your form) and create hidden input fields of same names with
corresponding values.

something like this should do the trick:
<cfoutput>
<form action='finalactionpage.cfm' method='post'>
<cfloop list="#form.fieldnames#" index="fieldname">
<input type='hidden' name='#fieldname#' value='#form[fieldname]#'>
</cfloop>
</cfoutput>

then display the question for review using
<cfoutput>#htmlcodeformat(form.question)#</cfoutput> or something
similar, keeping in mind that line breaks from a simple textarea will
not be visible in html output (thus i used htmlcodeformat() to preserver
them above). you can alternatively replace all #chr(13)&chr(10)# in the
question's text with <br> using replace() function. or do whatever else
you want.

add a submit button which will submit the hidden form to its
fianlactionpage.cfm and you are done.

hth

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

Thank you much - I will try it out

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

🙂 some success . . . the preview page displays the question and the submit button, but it will not submit. I attached the code below. thank you!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

<input name="submit" type="button" value="submit" />

type="button" is not same as type="submit". for a simple button you need
to provide a js function in the onClick event that will submit your
form. type="submit" buttons will submit the form automatically.

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

.----- thank you more success . . the preview page works and now the submit button works too.
However I get a Element FULLNAME is undefined in FORM

I have not been able to figure out this part.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

The fields are defined - why am I getting this error?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

sorry, i have not been very attentive reading your recent posts. you
have, unfortunately, done it all wrong... do you understand how cfloops
work?

your cfloop over #form.fieldnames# list should have just one hidden
<input ...> inside of it, literally:
<input type='hidden' name='#fieldname#' value='#form[fieldname]#'>

that's it. nothing else. no cfinsert, either.

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 22, 2008 Sep 22, 2008

Copy link to clipboard

Copied

Thanks for coming back. I am novice at CF and thought the comma delimited list meant formfields using insert that I used on the final form to insert data into the database- I removed all but one of the inputs as you instructed and now no data is inserted into the database. code is attached --thanks again -- jim

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 22, 2008 Sep 22, 2008

Copy link to clipboard

Copied

3rd time lucky...

change this:
<input type='hidden' name='#question#' value='#form.question#'>
to this:
<input type='hidden' name='#fieldname#' value='#form[fieldname]#'>

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 22, 2008 Sep 22, 2008

Copy link to clipboard

Copied

I changed this
<input type='hidden' name='#question#' value='#form.question#'>
to this:
<input type='hidden' name='#fieldname#' value='#form[fieldname]#'>

and the preview page displays and I can preview the submitted question. When I click submit on the preview page the final action page displays but data does not get inserted into the database. - thanks
jim

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 22, 2008 Sep 22, 2008

Copy link to clipboard

Copied

care to post the code of the final action page? it's a bit hard to guess
what can be wrong, you know...

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 22, 2008 Sep 22, 2008

Copy link to clipboard

Copied

LATEST
Hi
thanks again for all your time.

the final action page code is listed below: it does not put any data in the database and it
returns Element FULLNAME is undefined in FORM. error if I use the output tag in the code below. thks
jim

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 19, 2008 Sep 19, 2008

Copy link to clipboard

Copied

you have a cfinsert inside your cfloop - why???

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Documentation