Refresh File Component when Lookup Value is changed...

I have a File Component that displays an image from a custom field (Lookup).  The image loads fine, but when the user changes the lookup field, the image does not update.  I have tried adding the following code as an in-line snippet, but it isn’t working.  Any suggestions?


skuid.component.getById(‘imgColorRef’).Render();

also tried:
skuid.component.getById(‘imgColorRef’).conditionallyRender();

I’m not sure I understand.  Are there two places where this image is referenced on your page.  In one place the image is shown,  but in another place the lookup field is edited?   Are these connected to the same model?  Please clarify. 

Thanks. 

i have an object for colors, which has the color name and a sample image with the color.  this object is used as a lookup in the main object.  one that main page, i have a field editor with a field for color and i have a file component that displays the color image.  it works fine when i refresh the screen, but i need the file component to update when the color field is changed… is this possible?  thanks so much for the help!

Ah yes. That makes sense.

The file object does not listen for changes at this point and so will not be a very good candidate for what you are trying to do. I’d reccomend you just post your image using our template component. Your html code in the template will be somthing like:

This will pick up changes on file save, but not on initial change. Creating a listener on the particular field in question that forced an update on the template so intial row change would be possible in Javascript - but not declaratively.

thanks for the help.  were i to use java, how would i go about coding a snippet that would “refresh” the file component?  I like to add it to the “save” button…

Java is to Javascript as car is to carpet…

Snort!  Thanks Moshe. 

Scott - I dont think you need to use Javascript here.  What is the extra function you want your users to be able to do with the file component?  With the template they will be able to see the sample image for thier color - and when the file is saved with a new color,  the new sample image will show (without a page reload). 


But if you really want a snippet anyway… try something like this:

var model = skuid.model.getModel('YourModel');var row = model.getFirstRow();<br>var changeListener = new skuid.ui.Field(row, model, null, {fieldId:'Your_Field__c', register:true});<br>changeListener.handleChange = function(){<br>// do logic here<br>model.updateData();<br>};

i want the user to be able to see the updated color image if they change the color field.  right now, hitting the save button does not update the image.  i’m using the queue/page include feature, so a page reload seems to reset the page include back to start…

Scott, following up here - have you tried the template component as I reccomended above?