Solved

Creating a type of confirmation page - jQuery?

Posted on 2007-11-27
26
316 Views
Last Modified: 2012-06-21
I am wondering if it is possible to have a form, submit it, show all details before it is finally submitted like a confirmation page, but keep it on the same page? Or is it better practice to make a new page?

http://www.newspapersofamerica.com/new/index.php?p=calc

If you go there I have the form working, just need to fix styles, etc. I have tried googling methods tried pixel2life.com and others with no luck.

Thanks,

Ryan
<?php

 if($_POST){

  

  $fields = array("ad"=>"Ad Text", "fn"=>"First Name", "ln"=>"Last Name", "company"=>"Company Name", "email"=>"E-mail","phone"=>"Phone","date"=>"Starting Date","comments"=>"Comments");

 

$error_message = "<b>Please complete the following fields:</b> <br>";

$error         = 0;

 

foreach($fields  as $key=>$value){

	if(!isset($_POST[$key]) || empty($_POST[$key])){

		$error_message .= $value."<br>"; 

		$error = 1;

	}

}

if(empty($error)){

  

        $weeks    = $_REQUEST["weeks"];

        $ad       = $_REQUEST["ad"];

        $fn       = $_REQUEST["fn"];

        $ln       = $_REQUEST["ln"];

        $company  = $_REQUEST["company"];

        $email    = $_REQUEST["email"];

        $phone    = $_REQUEST["phone"];

        $date     = $_REQUEST["date"];

        $comments = $_REQUEST["comments"];

        

        $mininumGroupPrice = 15;

        $additionalPrice   = 0;

        $wordPriceGroup    = 1100; // price for say 15 words is $1100 every additonal word equals to below ($wordPrice)

        $wordPrice         = "15"; // price for every additonal word

 

                $tmp_ad = str_replace(array("\n","\r","\t"), array(" "," "," "), $ad);

                $tmp_ad = str_replace("  ", " ", $tmp_ad);

                $numwords = 0;

                $words_arr = explode(" ", $tmp_ad);

                foreach ($words_arr as $word){

                  if (strlen($word)>1){

                    $numwords++;

                  }

                }

 

                $additionalWords = $numwords - $mininumGroupPrice;

                

                if($additionalWords > 0){

                        $additionalPrice = $additionalWords * $wordPrice;

                }else{

                        // the words is not exceeding 15 words

                        $additionalPrice = 0;

                }

                //     $total = $numwords * $wordprice;

                $total = $wordPriceGroup + $additionalPrice;

               

                print "Word Count:" . $numwords ."<br />";

                print "Text:" . $ad ."<br />";

                print "Weeks to Run:" . $weeks ."<br />";

                print "Price:" . $total;  

  }  

}       

if(isset($error) && !empty($error)){

  print $error_message;

}

?>

 

<h3>Ad Text</h3>

<form name="calculate" action="index.php?p=calc" method="post" class="niceform" />

        <label for="weeks">Weeks to run ad:</label><br />

        <select name="weeks" id="weeks">

                <option value="1">1 week</option>

                <option value="2">2 weeks</option>

                <option value="3">3 weeks</option>

                <option value="4">4 weeks</option>

        </select><br />

        <p>$1110 - 15 words</p>

        <label for="ad">Ad Text:</label><br />

        <textarea name="ad" id="ad" rows="5" cols="20"></textarea><br />

        

        <label for="fn">First Name:</label><br />

        <input type="text" name="fn" id="fn" size="20" /><br />

        <label for="ln">Last Name:</label><br />

        <input type="text" name="ln" id="ln" size="20" /><br />

        <label for="company">Company Name:</label><br />

        <input type="text" name="company" id="company" size="20" /><br />

        <label for="email">E-mail:</label><br />

        <input type="text" name="email" id="email" size="20" /><br />

        <label for="phone">Phone:</label><br />

        <input type="text" name="phone" id="phone" size="20" /><br />

        <label for="date">Starting Date:</label><br />

        <input type="text" name="date" id="date" size="20" /><br />

        <label for="comments">Comments:</label><br />

        <textarea name="comments" id="comments" rows="5" cols="20"></textarea><br />

        

        <input type="submit" name="submit" value="Calculate!" />

</form>

Open in new window

0
Comment
  • 13
  • 13
26 Comments
 
LVL 17

Accepted Solution

by:
jasonsbytes earned 500 total points
ID: 20358558
Usually you would submit the form, and from the inputs the user supplied, display what they typed on the screen, then also you have another form and in this form you just have all hidden input types instead of the normal ones and you just put each value in a hidden, and display a submit button to confirm the data.  When they submit this one, then you can process it or do whatever.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20358658
Yeah...that sounds correect. I am lost on how to do that? Why have another form with the hidden? Why not just show what they typed, then submit?
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20358846
well, if you want to show what they typed inside of form boxes, that is fine, but isn't that what they just saw after they typed it?

If you want to display to them what they submitted as just plane text, you can't submit that.  So you would display it to them in plane text, but then behind the scenes print your <form> </form> and inside the form, print an input type=hidden name="same as original form" value="whatever they typed" and then just have your submit value="click to confirm" button.

Hope this heps.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20358971
Thats what I was thinking setting it up as printing them in plain text on the page, then a back button to return to edit fields, etc.

Does that work? Would that still use hidden form fields? Make a step thing on the same page, instead of creating another page, or is it better practice to do that?
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20359214
To save yourself from writting extra code to repopulate the form fields with a back button, just tell them to use their browser's back button to go back if they need to edit.

0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20359352
True..and the fields will still be loaded? Do you know how I would do that? After hitting submit to review say..bring them to display there fields?
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20359439
If they hit the back button in the browser the fields will still be loaded.

Otherwise, you would have the click a link and you would have to post the field values from the hidden form fields back to the previous page, read them and re-display the form fields with the values from the hidden fields populated into the form text boxes.

Or you could have a javascript button that does a browser.back operation (same as if they click the back button).
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20359459
True...thats alot of extra work. Any idea how I would make them display after click the button? For a confirmation? On the same page.
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20359520
You could just have a javascript window pop up showing them what they typed in the boxes and then they can click something like YES or NO if they agree.  If they click YES you go ahead and submit the form, if they click NO you cancel and they can then make changes.

<form onsubmit="return verifyInput();">

verifyInput will be a javascript function to display results and a button to click and so if they click YES the function will return TRUE and if they click NO return false.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20359823
I thought of that and told the client, thats what i thought. But then I dont want to deal with popups, and wanted to go wth showing the content on the page.

Ryan
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20360154
You could use a <div> and modify the innerHTML property of it with Javascript to display it on the page without displaying a popup.

So have a blank div where you want to display it:
<div id="confirm"></div>

Then onsubmit call a function that will do something like:

function confirm()
{
    var confirmtxt;
    confirmtxt += 'name: ' + document.form.name.value + '<br />';
    confirmtxt += 'address:' + document.form.address.value + '<br />';

    var el = document.getElementById('confirm');
    el.innerHTML = confirmtxt;
}
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20360341
That would be a good idea..is it possible to show up just that on a page? How would I implement that?
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20360963
well, that is a javascript question and to get the best answer from qualified javascript experts, you'll want to post that in the javascript zone.
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 1

Author Comment

by:catonthecouchproductions
ID: 20361069
Could you give me a PHP verfsion, I think I want to go down that road, and have it display.
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20361200
Do you mean where you submit it and it displays the results on a new page and uses a hidden form with hidden fields and then to confirm it they have to click submit again to submit the hidden form?
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20361205
Yeah..a confirmation page before submit.

Ryan
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20361336
All you have to do for that is when the user clicks submit the first time, whatever page you are posting the data to, just get the variables and print them for the user to see.  Somewhere below that you have your form, with your <input type="hidden" name="someName" value="whatever the value"> for each field from the previous form, then you show another submit button that submits the data to the script that will do whatever it is you need to do with it.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20361366
So make a new page and use GET to get all values correct? Display them style them however, etc.

Then make a form and ALL values are hidden correct?

Ryan
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20361637
well, you'd probably use POST instead of GET since you aren't passing anything throught the URL, but yes, that is basically it.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20361704
Well use GET on the confirm page to recieve them?
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20361759
Like this so far for confirm.php
<?php
 

        $weeks    = $_GET["weeks"];

        $ad       = $_GET["ad"];

        $fn       = $_GET["fn"];

        $ln       = $_GET["ln"];

        $company  = $_GET["company"];

        $email    = $_GET["email"];

        $phone    = $_GET["phone"];

        $date     = $_GET["date"];

        $comments = $_GET["comments"];

        

        

        print '

        		<h2>Confirm Details</h2>

        		

        		<label>Number of weeks to run ad

        

        '
 

?>

Open in new window

0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20361909
Unless you are passing the values to this confirm page through the url you need to use _POST to get the values into your variables.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20361938
So on my calc.php my form action is POST to confirm.php and for my variables I use POST? Not GET like I have above?
0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20362080
The words POST and GET don't mean anything...  POST just means you submitted the varibles from a form and GET means you submitted them through the URL.

So you need to do:
$weeks    = $_POST["weeks"];

Because you used method=POST so this is a POST variable not a GET varible.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
ID: 20362275
I see now! I got it, thanks for your help!
<?php
 

        $weeks    = $_POST["weeks"];

        $ad       = $_POST["ad"];

        $fn       = $_POST["fn"];

        $ln       = $_POST["ln"];

        $company  = $_POST["company"];

        $email    = $_POST["email"];

        $phone    = $_POST["phone"];

        $date     = $_POST["date"];

        $comments = $_POST["comments"];

        $mininumGroupPrice = 15;

        $additionalPrice   = 0;

        $wordPriceGroup    = 1100; // price for say 15 words is $1100 every additonal word equals to below ($wordPrice)

        $wordPrice         = "15"; // price for every additonal word

 

                $tmp_ad = str_replace(array("\n","\r","\t"), array(" "," "," "), $ad);

                $tmp_ad = str_replace("  ", " ", $tmp_ad);

                $numwords = 0;

                $words_arr = explode(" ", $tmp_ad);

                foreach ($words_arr as $word){

                  if (strlen($word)>1){

                    $numwords++;

                  }

                }

 

                $additionalWords = $numwords - $mininumGroupPrice;

                

                if($additionalWords > 0){

                        $additionalPrice = $additionalWords * $wordPrice;

                }else{

                        // the words is not exceeding 15 words

                        $additionalPrice = 0;

                }

                //     $total = $numwords * $wordprice;

                $total = $wordPriceGroup + $additionalPrice;
 

        print "

        		<h2>Confirm Details</h2>

        		

        		<span class=\"confirm\">Number of weeks to run ad:</span> $weeks week(s)<br />

                <span class=\"confirm\">Ad Text:</span> $ad<br />

                <span class=\"confirm\">First Name:</span> $fn<br />

                <span class=\"confirm\">Last Name:</span> $ln<br />

                <span class=\"confirm\">Company:</span> $company<br />

                <span class=\"confirm\">E-mail:</span> $email<br />

                <span class=\"confirm\">Phone:</span> $phone<br />

                <span class=\"confirm\">Date:</span> $date<br />

                <span class=\"confirm\">Comments:</span> <span class=\"confirm-text\">$comments</span><br />

                <span class=\"confirm\">Word Count:</span> $numwords<br />

                <span class=\"confirm\">Price:</span> $total<br />

              ";

              

		print "

				<form name=\"calc\"/>

				<input type=\"hidden\" name=\"weeks\" value=\"$weeks\" />

				<input type=\"hidden\" name=\"ad\" value=\"$ad\" />

				<input type=\"hidden\" name=\"fn\" value=\"$fn\" />

				<input type=\"hidden\" name=\"ln\" value=\"$ln\" />

				<input type=\"hidden\" name=\"company\" value=\"$company\" />

				<input type=\"hidden\" name=\"email\" value=\"$email\" />

				<input type=\"hidden\" name=\"phone\" value=\"$phone\" />

				<input type=\"hidden\" name=\"date\" value=\"$date\" />

				<input type=\"hidden\" name=\"numwords\" value=\"$numwords\" />

				<input type=\"hidden\" name=\"total\" value=\"$total\" />

				</form>

			  ";
 
 

?>

Open in new window

0
 
LVL 17

Expert Comment

by:jasonsbytes
ID: 20362459
You're welcome!
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

This article will explain how to display the first page of your Microsoft Word documents (e.g. .doc, .docx, etc...) as images in a web page programatically. I have scoured the web on a way to do this unsuccessfully. The goal is to produce something …
Since pre-biblical times, humans have sought ways to keep secrets, and share the secrets selectively.  This article explores the ways PHP can be used to hide and encrypt information.
The viewer will learn how to dynamically set the form action using jQuery.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

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

19 Experts available now in Live!

Get 1:1 Help Now