Buttons: grey out and disable click functions

When clicking on a row action or editing a record, I would like to disable certain buttons. 

Example 1: When clicking on row action to view an existing contact, I would like the cancel button greyed out and disabled. You dont cancel an existing contact, but when you are editing the contact on the same page, you need a cancel button to cancel any changes the user has made. 

Example 2: When clicking a custom edit button, I would like the button to be greyed out and disabled. Then after a custom save button is clicked, make the button active and enabled. 

Check this out : https://community.skuidify.com/skuid/topics/how-do-i-enable-disable-a-custom-button-in-skuid

Thanks Moshe. 

Similar use case where I had to provide a global Save button with multiple actions.  Here’s the code:


  1. Create a snippet responsible for enabling/disabling the button
  2. Register the snippet and call it during page load
  3. Create a model action to execute the snippet (in my case I do it for initiating events and all fields
  4. So far is working nicely


On-load JS

(function(skuid){ &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; <br>var $ = skuid.$;<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; // Register a snippet to run&nbsp;<br>&nbsp; &nbsp; skuid.snippet.registerSnippet('EnableDisableGlobalSaveButton', function(){<br>&nbsp; &nbsp; &nbsp; &nbsp; var model = skuid.model.getModel('QuoteLineItems');<br>&nbsp; &nbsp; &nbsp; &nbsp; if (model.hasChanged) {<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('#globalSaveButton').button('enable');<br>&nbsp; &nbsp; &nbsp; &nbsp; } else {<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('#globalSaveButton').button('disable');<br>&nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; });<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; // Run the snippet initially on page load<br>&nbsp; &nbsp; $('.nx-page').one('pageload',function(){<br>&nbsp; &nbsp; &nbsp; &nbsp; skuid.snippet.getSnippet('EnableDisableGlobalSaveButton')();<br>&nbsp; &nbsp; });<br>})(skuid);




Inline Code for model event

var params = arguments[0],<br>$ = skuid.$;<br>skuid.snippet.getSnippet('EnableDisableGlobalSaveButton')();



Enjoy!

Thanks Irvin, this worked for me after a small correction,
In here; on-load JS should be should be an In-line event in order to execute on-Load of the page and code for model event should be a snippet

In Banzai, page title buttons now have “Enable Rendering” as well as “Conditional Rendering” – javascript no longer needed! :slight_smile: