0

I have a page which has a form. When I click the submit button, I need to display a message prompt if continue submit or not. If the user clicks continue submit, I need to disable the submit button while the page is submitting.

The code below does not work.

<form action="action_page.php" method="post">

<button type="submit" id="subbutton" name="submit_page[]" onclick="return confirm('Are you sure of your choices?'); this.disabled=true;">Submit </button>

</form>

The code below is from my action_page.php

if(isset($_POST['submit_page'])){

}
Improve this question
0

4 Answers 4

Reset to default
1

Just set the pointer-events and opacity accordingly: 

#subbutton {
    "pointer-events" : "none", 
    "opacity" : 0.5
}

To reenable the button: 

#subbutton {
    "pointer-events" : "auto", 
    "opacity" : 1
}

Using JavaScript: 

function set_submit(type) {
    if(type == 'disable') {
        document.getElementById('divsubbutton').style.pointerEvents = "none";
        document.getElementById('divsubbutton').style.opacity = 0.5;
    } else {
        document.getElementById('divsubbutton').style.pointerEvents = "auto";
        document.getElementById('divsubbutton').style.opacity = 1;
    }
}

Use as needed:

set_submit('disable')
set_submit('enable')
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

It is due to preceding return statement which interrupts the onclick function prior reaching this.disabled=true; Simply remove the statement keyword return.

 < ... onclick="confirm('Are you sure of your choices?'); this.disabled = true;">Submit</button>
Improve this answer

1 Comment

I tried this. It disabled the button but I never reached action_page.php
0

I would define a function to handle the submit and disable the button. In fact, if you disable the button when it's clicked, the form won't be submitted; so you need to disable the submit button only after submission happens (i.e. within onsubmit event)

function onSubmit() {
    document.getElementById("subbutton").disabled = true; 
}

your html will look like:

<form action="action_page.php" method="post" onsubmit="return onSubmit()">

    <button type="submit" id="subbutton" name="submit_page[]" onclick="return confirm('Are you sure of your choices?');">Submit </button>

</form>
Improve this answer

1 Comment

I tried this one. My button was disabled, but I noticed that the submit process was so fast and the action_page.php was not reached.
0

Fairly simple - just add an if statement:

<button type="submit" id="subbutton" name="submit_page[]" onclick="if(confirm('Are you sure of your choices?')) this.disabled = 'disabled'">Submit </button>
Improve this answer

1 Comment

My form did not submit. It just disabled my button.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.