Amani
Amani

Reputation: 291

ajax on click disable the submit button and enable again

Hello all i have this function which works awesome but i get small issue

 $(document).ready(function(){
$("input[type='submit']").attr("disabled", false);
$("form").submit(function(){
  $("input[type='submit']").attr("disabled", true).val("Please wait.");
    setTimeout(function(){
    $("input[type='submit']").attr("disabled", false).val("Submit");    
}, 3*1000);
  return true;
})
})

The issue is when i have 2 forms in a page it changes value of all the submit buttons i just want the function to get activate for only the button clicked not for all the submit buttons .

i hope you get my point . i know that i need to modify some things in the function but i am getting some issues doing that ...

Upvotes: 0

Views: 38

Answers (1)

CertainPerformance
CertainPerformance

Reputation: 370679

Use this to refer to the currently submitted form, and then you can use .find to get that form's descendant submit input:

$("form").submit(function(){
  const input = $(this)
    .find("input[type='submit']")
    .attr("disabled", true)
    .val("Please wait.");
  setTimeout(function(){
    input
      .attr("disabled", false)
      .val("Submit");    
  }, 3*1000);
  return true;
});

Also note that you should probably prefer .prop over .attr, unless you're using an ancient version of jQuery.

Upvotes: 1

Related Questions