1

Here is the Javascript code, just for test:

<script type="text/javascript">
    function show_confirm()
        {
            var r=confirm("Are you sure?");
            if (r==true)
            {                   
            }
            else
            {                    
            }
        } 
</script>

And this is the php code:

<form action="Test.php" method="post">
    <input type="text" name="test"/>
    <input type="submit" value="submit" onclick="show_confirm()"/>
</form>

So if the submit button is clicked, a confirm box will pop out. And if "OK" button is clicked, the page will be redirected to Test.php and post method will be executed, like a normal php page submit operation. Or else, if the "cancel" button is clicked, i want it stay the same page and post method won't be executed. Is this function can be implemented and how to modify the code? I know PHP is for server and JS is for client. I'm not sure if I can mix them like this. Or I should use Ajax? Thanks for help!

Improve this question
0

4 Answers 4

Reset to default
2

The best way to do this is as follows:

<script>
    function show_confirm(){
        return confirm("Are you sure?");
    }
</script>
<input type="submit" onclick="return show_confirm();">

The reason I use show_confirm instead of the built-in function directly is because if you want to change the functionality of the confirm popup, it is much harder if you are using the builtin function everywhere in your code.

Abstracting out this kind of functionality and writing clear, simple code like this will make you a better programmer :)

warning: as indicated in my comments below, this will only work if the user explicitly clicks the submit button. If the user submits the form by some other method, the confirm box will not show. See http://www.w3schools.com/jsref/event_form_onsubmit.asp if you want to show a confirm regardless of how the form was submitted.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

@user878729: You may also be interested in knowing why onclick works the way it does. What happens when you provide "return show_confirm()" as a string in the HTML is that it gets parsed out by the browser, and put in the body of a function, which is then attached to the submit button's DOM node as the onClick function. When you click the submit button, this function is called. Also, be careful as this will only trigger if you click the submit button. Say there is a textbox in the form and the user presses enter - the onclick will not trigger. Maybe look into <form onsubmit="...">
2

You can do this directly from the button. return false will cancel the submission ... so....

<input type="submit" onclick="javascript:return confirm('Are you sure?');">

if the user clicks 'ok' the dialog will return true, otherwise false.

to be complete here it is in function form. 

function show_confirm()
{
  var r = confirm("Are you sure?");
  if(r == true)
  {
     // do something
     return true;
  } else {
     // do something
     return false;
  }
}

edit: reading this almost 4 years later I'm compelled to change it.

function show_confirm()
{
  var r = confirm("Are you sure?");
  if(r)
  {
     // do something for true
  } else {
     // do something for false
  }
  return r;
}

call it with <input type="submit" onclick="javascript:return show_confirm();">

I believe this will also handle the case where nothing is selected but the dialog is closed.

note: inline event listeners should be avoided. attach an event listener with Javascript.

Improve this answer

6 Comments

He'll need to also change the show_confirm function so that it returns a value.
I have removed that function.. unless some other validation is being run I do not see a need for it.
Nice. Note that you do not need the javascript: part in the onclick attribute. onclick="return..." suffices. For the function form version I understand you supplied the same if syntax as the OP for clarity, so @ the OP: this kind of syntax is verbose and unnecessary. r is already a bool, so return r is preferred over the if-else syntax since it's more succinct.
Yes, I agree. however an if statement is required if any other code it being conditionally run based on the outcome of the confirm dialog. it could be condensed to if(confirm(text)){ /* some other code */ return true;} return false;
@rlemon: Yes that's true. I still might be tempted to do if (r){ ...} else{...} return r;. If you can minimize the number of exit points without making the code any more complicated it can make debugging a little easier.
|
0 
<script type="text/javascript">
    function show_confirm()
        {
            var r=confirm("Are you sure?");
            if (r==true)
            {     
                 document.location.href= 'page.php';              
            }
            else
            {                    
                 return false;
            }
        } 
</script>
Improve this answer

1 Comment

will that retain the post data?
0

Simplifying rlemon's answer even further (no need for the javascript:return, also fixed the inner double quotes):

<input type="submit" onclick="return confirm('Are you sure?')" />
Improve this answer

1 Comment

Actually, you do need the return. Just not the javascript:. If you're wondering why, it's because the code you put in the onclick ends up getting bound to the submit element's DOM node as the body of the onclick function. This function is called and checked to see if it's false on click, so you must actually return false if you want the form to not submit.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.