Confirm Before Form Submission

Question

I created a PHP page to delete from my database. This PHP page is the action of a form submission. The form is submitted by clicking a pic of "X" sign. How can I ask user to confirm before the submission of the form and therfore deleting from my database?

This is my code:

<form method='POST' action='delete.php'><input type='image' src='images/delete.png' class='del' alt='Submit Form' />

I tried to do it inline by adding this to my form tag, but it did not work:

onsubmit="return confirm('Are you sure you want to submit this form?');"

Answer 1

From a comment by the OP:

echo "onclick='return confirm(\'Are you sure you want to submit this form?\');'"

You can't use single quotes in an attribute value delimited with single quotes.

Your options are:

Use double quotes in the JS

echo "onclick='return confirm(\"Are you sure you want to submit this form?\");'"

Use double quotes in the HTML

echo "onclick=\"return confirm('Are you sure you want to submit this form?');\""

Use entities

echo "onclick='return confirm("Are you sure you want to submit this form?");\""

When out you put JavaScript inside an HTML attribute value inside a PHP string you have three different languages all mixed together, and you have to be very, very careful with your escaping so that you escape the right characters for the right languages at the right times.

As a rule of thumb, it is better to keep that contents of PHP strings to a minimum. Only drop into PHP mode when you have a variable.

?>
    <form method='POST' action='delete.php'>
        <input type='image' src='images/delete.png' class='del' alt='Submit Form' onclick="return confirm('Are you sure you want to submit this form?');" />
    </form>
<?php

For the same reason, it is better to keep your JavaScript in an external file and attach event handlers with addEventListener instead of onFOO attributes.