5

Hopefully this is quite simple! Here's my setup:

enter image description here

I have a custom Status Indicator column (PSI), and a "Production Status" column. I want the PSI column to show a different icon depending on the contents of the Production Status column. So IF(Production Status="a", PSI="1.jpg"), IF(Production Status="b", PSI="2.jpg"), and so on.

I understand how to replace content in the same column, and this is how the JS link currently works. I'd like to know how I get it to reference a different column. So when the user changes the "Production Status" (from a choice list), the PSI indicator icon will change to reflect the new status. Thanks!

6

When you're in the rendering cycle, in your CSR override code, ctx.CurrentItem will have other field values. So for instance you could check ctx.CurrentItem.ProductionStatus (or whatever the internal name of your field is).

I highly recommend setting a breakpoint in your CSR script and exploring what is available on the ctx object during rendering.

Another alternative though would be to make your PSI column a calculated column based on Production Status, and then in your CSR override code, just return the appropriate HTML to display an image based on the PSI column's value.

  • Thanks Dylan. Since I want to make PSI a site column, I don't think I can make it a calculated column referencing another field. I'd like to be able to edit the behaviour of the PSI column globally if possible. Could you explain more about how to add a breakpoint and explore the ctx object? – Mark E Mar 20 '17 at 14:22
  • 1
    If you open the developer tools window of your browser (F12 in Chrome, IE or Firefox, or just right click in the browser and choose the option that says "inspect"), there should be a section in the dev tools where you can see the scripts that are loaded and their source code. In Chrome it is called "Sources", I think in IE and Firefox it's called "Debugger". Anyway, find your script in there, and by clicking on a line number in the script, it should set a breakpoint. Then just refresh the page, and it will stop on your breakpoint. – Dylan Cristy Mar 20 '17 at 14:50
  • Then, once it's stopped, at least in Chrome there is a section on the right called "Scope", and you can find the ctx object in there. I know there are similar ways of inspecting the objects in IE and Firefox but I don't know exactly what they are called, I almost 100% use Chrome. – Dylan Cristy Mar 20 '17 at 14:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.