I want to disable submit button once it has clicked for send.this is my submit button code

<button title="<?PHP echo getTranslatedString('LBL_SAVE_ALT'); ?>" accessKey="S" class="btn btn-primary" value="<?PHP echo getTranslatedString('LBL_SAVE_LAPTOP'); ?>" id="formSave" type="submit" name="button" onclick="return checkform();">

Save detail and this is onclick function code

function checkform() {
var incvfr = $("#invoice").val();
var inseridf = $("#invserial").val();
if (incvfr == 1) {
    if (inseridf == '') {
        alert("Please enter invoice number");
        return false;
    }
} else {
    document.save.submit();
    document.getElementById('formSave').setAttribute("disabled", "disabled");
}
}

when i disable submit button then form not send for save just disable button how to do it. when i use disable code after save.submit(); then form submit but save button not disable

I want to disable submit button once it has clicked for send.this is my submit button code

<button title="<?PHP echo getTranslatedString('LBL_SAVE_ALT'); ?>" accessKey="S" class="btn btn-primary" value="<?PHP echo getTranslatedString('LBL_SAVE_LAPTOP'); ?>" id="formSave" type="submit" name="button" onclick="return checkform();">

Save detail and this is onclick function code

function checkform() {
var incvfr = $("#invoice").val();
var inseridf = $("#invserial").val();
if (incvfr == 1) {
    if (inseridf == '') {
        alert("Please enter invoice number");
        return false;
    }
} else {
    document.save.submit();
    document.getElementById('formSave').setAttribute("disabled", "disabled");
}
}

when i disable submit button then form not send for save just disable button how to do it. when i use disable code after save.submit(); then form submit but save button not disable

• javascript
• jquery
• html

• are you redirecting back from the page submission? – madalinivascu Commented Sep 6, 2016 at 4:45
• No when i click save details there is no effect in form just disable button but i want to send form – phpdev Commented Sep 6, 2016 at 4:49
• "Hello sir". Good afternoon madam. – nnnnnn Commented Sep 6, 2016 at 4:52
• I don't know whether you're fortable using php to keep a button disable after refresh, However here's a solution in JS stackoverflow./a/22279996/5336321 – Hitesh Misro Commented Sep 6, 2016 at 6:15

4 Answers 4

Try one() method in jQuery, it will run once for an element and might simplify your code.

jQuery Solution:

$(function(){
  $('#formSave').one('click', function() {  
    $(this).attr('disabled','disabled');
  });
});

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input title="" accessKey="S" class="btn btn-primary" value="Save detail" id="formSave" type="submit" name="button" onclick="">

JavaScript Solution:

Use setAttribute() method.

function disable(){
  document.getElementById('formSave').setAttribute("disabled", "disabled"); 
}

<input title="" accessKey="S" class="btn btn-primary" value="Save detail" id="formSave" type="submit" name="button" onclick="disable()">

As I can see that you re using jQuery so when you are saving after that you can use jQuery hide function to hide your button by passing button id

function checkform(){
  var incvfr=$("#invoice").val();
var inseridf=$("#invserial").val();
  if(incvfr== 1) {
  if(inseridf==''){
    alert("Please enter invoice number");
    return false;
    }
} else {
    document.save.submit();
$("#formSave").hide();
}
 }

You can disable submit button using

$("#formSave").attr('disabled',true);

or

$("#formSave").prop('disabled',true);

add property disable

$("#formSave").prop('disabled',true);

if you want revert it use

$("#formSave").prop('disabled',false);