Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

PHP

Gary Stewart
Gary Stewart
14,142 Points

Adding a confirmation box to a form submission?

So I have the following form being echoed within PHP below:

echo '<form id="singleAmountForm" method="post" action="">';
                    echo '<input type="hidden" name="singleAmount" value="singleForm">';
                    echo '<label for="singleAmount">SINGLE AMOUNT :</label>';
                    echo '<input type="text" id="singleAmount" name="singleAmount" autocomplete="off">';
                    echo '<input type="submit" class="myButton" value="Submit">';  
                echo '</form>';

I would like for the form to prompt the user when they submit but would also like the prompt to contain some of the values submitted so for example when a form is submitted it asks:

"Are you sure you would like the submit the value of (inputted information)?"

Thanks so much!

1 Answer

Petros Sordinas
Petros Sordinas
16,181 Points

Gary,

You will have to use javascript or jquery. A quick and easy way is to add something like the following:

Javascript

<script type="text/javascript">

document.getElementById("singleAmountForm").onsubmit = function onSubmit(form) {
   singleAmount = document.getElementById("singleAmount").value;
   if (confirm("Are you sure you want to submit the value of " + singleAmount + " ?"))
      return true;
   else
     return false;

</script>

jQuery

<script type="text/javascript">
$('singleAmountForm').submit(function () {
   singleAmount =$("#singleAmount").val();
   if (confirm("Are you sure you want to submit the value of " + singleAmount + " ?"))
      return true;
   else
     return false;
});
</script>