Problem with Image Selector in Custom Widget - Sitefinity - Front- & Back-End Development

All Replies

Posted by Community Admin on 14-Oct-2011 00:00

Hello,
I have created a custom widget following primarily this post. I took from that example the Page Selector and Image Selector only, and then added my own text field (for a title). I then changed the ImageField to use the GUID of the selected image instead of the url.

I did this by changing the line:

ImageSelector.DataFieldType = typeof(String);

To:

ImageSelector.DataFieldType = typeof(Guid);

The widget works in every aspect, except when (in the refreshUI javascript function) I do a "set_value()" using the Guid of the image, the ImageField doesn't update to show the image as the selected image. By that I mean there is no preview of the image, and the Guid is set to all zero's. If I then do nothing and hit "Save", the all zero's Guid (which appears to be the default value) gets set and the previously selected image gets lost.

I am unsure what I am doing wrong, or what else I might need to change besides the line of code above to get this to work. Any help would be greatly appreciated.

Thank you for your time,
Josh

Posted by Community Admin on 14-Oct-2011 00:00

unfortunately, it appears that only the ContentLink and Src options update the preview of the selected image. I have already relayed this feedback to the team so that we can hopefully make this work on all modes.

until then, however, the best way to do it is to use the Src mode. it might be possible to use the API to convert the Url into a Guid, but if the preview is a must, the Src is your best bet for now.

i hope this is helpful, thank you for your feedback!

Posted by Community Admin on 25-Oct-2011 00:00

Thank you for the help. I had a feeling that was the answer. For anyone looking at this I worked around this problem, by having the DataFieldType set to String (thus using the url of the images). I then have (in the control), a Property to hold the Guid of the image, and then have a Property that gets the MediaUrl of the image and returns that.

Then when the javascript runs and does the "set_value()", I call the MediaUrl property, but when I do the "get_value()" during the saving phase, I instead used the "ImageSelector.get_selectedImageItem().Id and save that to the Guid field in the control. This makes sure that I am always getting the Guid of the image, but using the url for display and selection.

One caveat to the above, is that if you don't append a ".tmb" extension to the MediaUrl then Sitefinity doesn't quite load properly and messes with the size of the image, and you get weird results (probably from the default size being 555). So when getting the Media url to display in the designer I had the program ad a ".tmb", and then not add it when outputting the code for the actual control.

Hope this helps.

Josh

This thread is closed