use snippet to change field color

Is it possible to use on field in a table to change the color of another field.
I suspect the snippet looks something like this?

var field = arguments[0],    value = arguments[1],               $ = skuid.$;
            if(field.metadata.accessible)
           
            { if(value === ‘Primary’)
                {
            // do CSS stuff here…
                    field.element.css({‘background-color’:’#c6e28e’,‘min-height’:‘10px’, ‘padding’: ‘0px 0px 0px 0px’,‘border-radius’: ‘4px’, ‘color’: ‘#000000’});
                }    }

See video
https://docs.google.com/file/d/0B409lhd9sYDcVU5qa19ETkZLalk/edit

A custom field renderer should do the trick.  Something like this:

// phoneFieldRenderer.js<br>var $ = skuid.$;<br>var field = arguments[0];<br>var value = arguments[1];<br>var row = field.row;<br>switch (field.mode) {<br>&nbsp; &nbsp; case 'edit':<br>&nbsp; &nbsp; &nbsp; &nbsp; skuid.ui.fieldRenderers[field.metadata.displaytype].edit(field, value);<br>&nbsp; &nbsp; &nbsp; &nbsp; break;<br>&nbsp; &nbsp; case 'read':<br>&nbsp; &nbsp; case 'readonly':<br>&nbsp; &nbsp; &nbsp; &nbsp; var cellElem = field.element;<br>&nbsp; &nbsp; &nbsp; &nbsp; var isPrimary = row.Is_Primary__c;<br>&nbsp; &nbsp; &nbsp; &nbsp; if (isPrimary &amp;&amp; isPrimary === 'Primary') {<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; cellElem.css('background-color', '#c6e28e');<br>&nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; &nbsp; &nbsp; skuid.ui.fieldRenderers[field.metadata.displaytype].read(field, value)<br>&nbsp; &nbsp; &nbsp; &nbsp; break;<br>}

Thanks Irvin,

So, if the field name “Primary_Sequence__c” is the one I am looking for “Primary” and the field I want change to red is "Phone_Number_Stacked__c"

What would the code look like?


Try this:

// phoneStackedFieldRenderer.js // (Phone_Number_Stacked__c) <br>var $ = skuid.$;<br>var field = arguments[0];<br>var value = arguments[1];<br>var row = field.row;<br>switch (field.mode) {<br>&nbsp; &nbsp; case 'edit':<br>&nbsp; &nbsp; &nbsp; &nbsp; skuid.ui.fieldRenderers[field.metadata.displaytype].edit(field, value);<br>&nbsp; &nbsp; &nbsp; &nbsp; break;<br>&nbsp; &nbsp; case 'read':<br>&nbsp; &nbsp; case 'readonly':<br>&nbsp; &nbsp; &nbsp; &nbsp; var cellElem = field.element;<br>&nbsp; &nbsp; &nbsp; &nbsp; var primarySequence = row.Primary_Sequence__c;<br>&nbsp; &nbsp; &nbsp; &nbsp; if (primarySequence &amp;&amp; primarySequence === 'Primary') {<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; cellElem.css('background-color', '#c6e28e');<br>&nbsp; &nbsp; &nbsp; &nbsp; }<br>&nbsp; &nbsp; &nbsp; &nbsp; skuid.ui.fieldRenderPrimary_Sequence__cadata.displaytype].read(field, value)<br>&nbsp; &nbsp; &nbsp; &nbsp; break;<br>}



Almost.

Bill, I hacked this together in the world’s greatest IDE, Notepad :).  Add a semi-colon at the end of the error line, like this:

skuid.ui.fieldRenderPrimary_Sequence__cadata.displaytype].read(field, value);



Thanks Irvin

I have copied the code into JS and still seem to get the error. I must admit I am not a Java person and do everything with as little scripting as possible. This is my second script. Can you see why this is happening?

Yup, a few more bugs in Irvin’s code.  We don’t hold it against him.   Below just corrects the syntax: 

skuid.ui.fieldRender[Primary_Sequence__c.data.displaytype].read(field, value); 

But you might also try:

skuid.ui.fieldRender[field.metadata.displaytype].read(field, value);

Sorry Bill. Was rushing and trying to edit with the Community inline editor. Oh well, guilty as charged.

Beggars can’t be choosy Thanks!

Getting Closer.  The snippet had no errors but the snippets breaks the page.
https://docs.google.com/file/d/0B409lhd9sYDcQ3BQTTBMRGo1OWc/edit?pli=1


Open Chrome developer tools and see what sort of errors we’re getting.

Not sure how to use the google developer tools.