Disable button after submit with form that has PHP function. No jQuery

Question

I have a HTML form echoed in PHP, the form action calls a PHP function. I want to disable the submit button after its been clicked without using jQuery if possible.

#PHP
echo '
<form method="POST" action="' . phpFunction() . '">
    //form fields
    <button name="submit" type="submit" class="btn btn-primary btn-block">Enviar</button>
</form>';

I have tried using onclick="this.disabled=true" on the button, but it prevents the PHP function from excecuting. What should I do to excecute the function and disable the button?

I'm curious, what's inside the function? It is just that, the action attribute is just the path to where it will send its data, so there is really no need to make it a function. — Carl Binalla
– Carl Binalla, Commented Nov 28, 2019 at 4:03
Sanitization, inserting into DB, but written as a function. Dont know why. — Ricardo Mehr
– Ricardo Mehr, Commented Nov 28, 2019 at 4:31
after submit set document.getElementById("btnID").disabled = true; it might help — Yash
– Yash, Commented Nov 28, 2019 at 5:03

Chaminda Chanaka · Accepted Answer · 2019-11-28 04:58:22Z

1

Use this simple code to disable submit button

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type="text/javascript">
        function form_submission(form_id, button_id) {
            $('#btn_add').attr('disabled', 'disabled');
            document.getElementById(button_id).style.display = "none";
            document.forms[form_id].submit();
        }
    </script>
</head>
<body>
    <form action="submit.php" method="post" name="form_name" id="form_name">
        <input type="text" name="first_name" />
        <input type="text" name="last_name" />
        <input type="button" name="btn_add" id="btn_add" value="save" onclick="form_submission('form_name', 'btn_add')" />
    </form>
</body>

answered Nov 28, 2019 at 4:58

Chaminda Chanaka

1902 silver badges11 bronze badges

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

2 Comments

Yash Over a year ago

umm...why would you hide button, the OP asked to disable it.

Chaminda Chanaka Over a year ago

then don't use hiding part. you can use disable part

Gotenks-J · Accepted Answer · 2019-11-28 04:31:43Z

0

document.getElementById("yourButtonId").disabled = true;

Taken from here: https://www.w3schools.com/jsref/prop_pushbutton_disabled.asp

answered Nov 28, 2019 at 4:31

Gotenks-J

791 silver badge5 bronze badges

Collectives™ on Stack Overflow

Disable button after submit with form that has PHP function. No jQuery

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related