How to add onclick event for a checkbox within a table?

I have a use case where I want to run a snippet whenever a checkbox field is clicked. Any guidance would be appreciated.

Hi Rodrigo,

Very timely post.  I am facing the same use case.


So I added a custom field renderer to register my own handleChange event.  How to I get access to the row that was changed?  My use case is to update other fields in the same row depending on the change value.

var $ = skuid.$,&nbsp; &nbsp; field = arguments[0],<br>&nbsp; &nbsp; value = arguments[1];<br>&nbsp; &nbsp;&nbsp;<br>var editor = field.editor;<br>// Extend the default handleChange() functionality<br>editor.handleChange = function(changeInfo) {<br>&nbsp; &nbsp;;<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; // Handle the change<br>&nbsp; &nbsp; console.log('finalPrice:handleChange');<br>&nbsp; &nbsp;&nbsp;<br>&nbsp; &nbsp; // HOW DO I GET ACCESS TO THE MODEL ROW?<br>}<br>skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field,value);

Hey guys,

I haven’t tried this specific approach in your use case, but its kind of similar to what Ben Hubbard suggested to me in a previous post here

The idea being, rather than create a custom field renderer, create an action on that model, which runs whenever the checkbox is updated, ie…

1. Create an action on the model containing the checkbox field, which is “when row(s) in model are updated” and have it execute only when a specific field is updated (the checkbox field)

2. Have that action run a snippet like…

var params = arguments[0],
$ = skuid.$,
updates = params.updates,

if (‘checkboxField__c’ in updates) {
//then do stuff depending on the value of the checkbox
boolean = params.row.checkboxField__c; 
   if (boolean) {
//do stuff for a TRUE boolean value
else if (!boolean) {
// do stuff for a FALSE boolean value
} updates = params.updates, }

Disclaimer: I’m typing this in an airport right now and haven’t checked whether or not this has errors, which it probably does, but hopefully you see the logic and can play around with it.

****Not sure what happened with the previous formatting of this post, but hopefully this will correct it


This worked out nicely.  Thanks!


Greg, thank you very much, it worked perfectly :slight_smile:

Confession: Rodrigo and I are pair programming building out an application.  With Greg’s guidance, we were able to construct a very cool feature with minimal code and CSS.  I will post a sanitized version soon for posterity.

Greg, thanks again for the hint!

Looking forward to seeing what you genius guys come up with!