title: enable disable jquery ui button with ajax
body: <p>I'm struggling to understand the options of enabling/disabling jquery ui buttons.</p>
  
  <p>Typically in the past for any kind of button I've used:</p>
  
  <pre><code>jQuery(".mybutton").prop('disabled', false);
  </code></pre>
  
  <p>Depending on whether you want it enabled/disabled it would be false/true.</p>
  
  <p>This seemed to work for jquery ui buttons as well. What I was doing was checking a certain count and disabling the button when you first load the page.</p>
  
  <p>But someone could change the count value by deleting something (via AJAX call):</p>
  
  <pre><code>//delete 
  jQuery(document).on("click", ".deletebutton", function() {
      if (confirm("Are you sure you want to delete?"))
      {
          var hash = jQuery(this).data("delete");
          var $this = jQuery(this);
          jQuery.ajax({
             url: "index.php?option=com_cam&amp;task=delete&amp;hash="+ hash +"&amp;"+getToken()+"=1&amp;format=raw",
             dataType: 'json',
             type: "POST",
             success: function(data){
                 if (data.type == 'error')
                 {
                     //error message printed to user
                 }
                 else
                 {
                     $this.closest("tr").remove();
                     //deleted so decrement and check if you have exceeded your limit
  
                     count=count-1;
                     if (count &gt;= limit)  
                     {
                             //disable buttons
                             jQuery( ".mybutton" ).button( "option", "disabled", true );
                     }
                     else 
                     {
                         //enable add buttons and hide message
                         jQuery( ".mybutton" ).button( "option", "disabled", false );
                         //jQuery(".mybutton").attr('disabled', false);
                         //jQuery(".mybutton").prop('disabled', false);
  
                     }
                 }
              }
          });
      }
  });
  </code></pre>
  
  <p>Then this should enable the button back again. Neither <code>prop</code> or <code>attr</code> or this <strong><a href="https://stackoverflow.com/questions/7545248/jquery-ui-enabling-disabled-button-doesnt-restore-event">post</a></strong> seemed to work for me. Only when I did this:</p>
  
  <pre><code>jQuery( ".mybutton" ).button( "option", "disabled", false );
  </code></pre>
  
  <p>I guess I don't understand why <code>prop</code> doesn't work in this context when it does work to disable my buttons? Is the best practice to always use the button <a href="http://ui-dev.jquery.com/demos/button/#option-disabled" rel="nofollow noreferrer">setter</a>?</p>