Question 35761 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Disable Button and change button text on click after ajax success function call – Jquery

I am working on PHP ajax project. I want to disable and change the button’s text after the success function call in ajax. my ajax function is working fine and I am getting the desired output. just one thing is remaining which is the button thing.
Here is my code for ajax.

 $(document).ready(function () {

  $(document).on("click", "#add_btn", function (e) {
    e.preventDefault();
    var id = $(this).val();
    var cus_id = $('#customer_selection').val();
    if (!cus_id) {
      alert("Please select a customer")

    } else {

      $.ajax({
        url: "add_selection_script.php",
        type: "POST",
        data: {
          id: id,
          cus_id: cus_id
        },
        success: function (data) {
          // here i want to change button text and disable for click button only
            not others because my buttons are dynamic
          prop("disabled", true);
          html("Added");

        }
      });
    }
  });
});

here is the button code

<button type="submit" id="add_btn" value="<? echo $id; ?>">Add to selection</button>
Tags:

2

Answers


  1. 0

    You need to set the attribute of the button and use .html or .text to change the text.

    success: function (data) {
  $('#add_btn').attr('disabled', true);
  $('#add_btn').html('changed text');
}
    Login or Signup to reply.
  2. 0

    you have to give identifier for which you have to make changes

    $("#add_btn").prop('disabled', true);
$("#add_btn").html('Added');

    if your button is dynamic, then you can do below:
    on click of button, get your element in a variable

    var element = $(this);

    and in your success function, write this

    element.prop('disabled', true);
element.html('Added');
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search