nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

DCT and Images

System

I have a DCT where I associate an Image by browsing for it. I do this via CGI callout. I wish to display the selected image in the DCT for the user without having to direct them to the preview page. Have any one of you done this before or do you have ideas how this could be done. Thanks in advance.

Find more posts tagged with

Comments

jbonifaci

You could have a cgi callout next to your browse button called 'preview image' that just opens up a simple window that displays the image.

Migrateduser

Thanks for your reply jbonifaci but my client wishes to preview the DCR without actually editing it. In the preview mode of a DCR the CGI buttons are hidden.

jbonifaci

If that's the case, about the only thing I think you could try is something like this. Have a textarea with external-editor="visualformat" right below your image field. Use formapi to hide this textarea in edit mode. onItemChange for your image field, use formapi to populate the textarea with <img src='/imagepath/image' />. Then when the user looks at the dcr in view mode, they should see the image in the textarea.

Let us know how this works for you.

~Jeff

Migrateduser

Thanks again Jeff that is exactly what I have been trying but I have run into the following problems:
1) Upon changing the value of a DCT form element using cgi-callout the onChange event for the element does not fire.
2) I tried to set this value "<img src="/imagepath/image.gif"> thro the callout and that does not work either
3) I manually changed the value and when it triggers it places the innerhtml in the textbox but the image renders as a red X
4) Upon Clicking finish (CC-PRO) and previewing the DCR the image displays fine!

jbonifaci

1) Upon changing the value of a DCT form element using cgi-callout the onChange event for the element does not fire.

You're right, I forgot about that. If the callout is a custom callout, you should be able to set the value of the hidden textbox with formapi in your callout window. If it's not, you could create a custom browse. You'll still want to have an onItemChange though, in case the user edits the field directly.

2) I tried to set this value "<img src="/imagepath/image.gif"> the callout and that does not work either

Is it a custom callout? You should be able to get the item and set it's value from your callout. If you're having problems, post some code and someone might be able to point you in the right direction

3) I manually changed the value and when it triggers it places the innerhtml in the textbox but the image renders as a red X

What is the path to image you are selecting? Is the path a relative path or is it the path from the base of the directory? Are there any proxy remaps for images? If so, I'm not sure if those are applied within the dcr. You might have to manipulate the path before you set it in the textarea.

4) Upon Clicking finish (CC-PRO) and previewing the DCR the image displays fine!

This would lead me to ask the same question as before. What is the path? Any remaps?

Migrateduser

Jeff,
I am using a custom callout.

/* IWCgicallout.js (the one that handles
* - handle_selection()
* - callback()
* - set_datacapture_item_value()
*/
// Fill the rpath field as needed.
for ( i = 0 ; i < calloutForm.elements.length ; i++ )
{
if (calloutForm.elements.name == ObjImgDsplyPath)
{
calloutForm.elements.value = "<img src=" + getFileRpath() + " />";
break;
}
}

Datacapture.cfg

<item name="THMNL_IMAGE_AST_DSPLY">
<label>Thumbnail Image:</label>
<textarea /> 
</item>
If I comment the visual formatter I am able to populate the textarea but without the visual formatter I am unable to disply the image!.

To me it looks like it does not have enough time to load and display the image. The paths are not being remapped it always remains as "/image/image.gif"

Solito

got it fixed ...?
could you share the solution ..?

Adam Stoller

FYI - in 6.5SP1, there's a new feature in FormAPI:

IWDatacapture.enableImagePreview(true);

Which should be set prior to init(), and provides for a thumbnail associated with a file browser - unfortunately, I do not believe this feature will work if you are using a custom file browser.

If anyone can provide a file browser that (a) provides complete freedom for where you search (local file system, network path, any TS branch/workarea) *and* (b) supports the ImagePreview functionality - please let me know.
(If I manage to write something I'll probably post it - but I'm hoping to avoid the development time since I'm on a limited-time-span engagement).

--fish
Senior Consultant, Quotient Inc.
http://www.quotient-inc.com