+- Form Tools (https://forums.formtools.org)
+-- Forum: Form Tools (https://forums.formtools.org/forumdisplay.php?fid=1)
+--- Forum: General Discussion (https://forums.formtools.org/forumdisplay.php?fid=5)
+--- Thread: View uploaded pictures in HTML / Printer Friendly Export (/showthread.php?tid=612)
View uploaded pictures in HTML / Printer Friendly Export - jglnb - Mar 26th, 2010
HI guys,
just wondering a quick question :
My uploaded images were coming up as broken pictures. I fixed this by changing the File Upload Folder to the uploaded file path as worked out in the upload setup. Now my pictures are coming up as massive in the report (ie report is rather difficult to read due to such big picture)
I see the thumbnails directory under the upload directory - hint hint I thought.
Is there any way of creating the thumbnails and then using them for the report source and becoming bigger if you click on the picture ?
Thanks for the patience and helping a newbie !!!
Cheers
JG
RE: View uploaded pictures in HTML / Printer Friendly Export - Ben - Mar 28th, 2010
Hi JG,
Sure! There's nothing in Form Tools to automatically create the thumbnails, but you can make it work the way you want with a little tweaking.
What you'll need to do is edit the markup in the Export Type that's being used to generate the report and add in a specific hardcoded width to the images. That will limit the size on the report. Then, wrap the image in an <a> tag that links to the full image. That's pretty much it!
Take a look at the Export Manager module to find the markup. Let me know if you get stuck.
Good luck!
- Ben
RE: View uploaded pictures in HTML / Printer Friendly Export - jglnb - Apr 1st, 2010
Quote:What you'll need to do is edit the markup in the Export Type that's being used to generate the report and add in a specific hardcoded width to the images. That will limit the size on the report. Then, wrap the image in an <a> tag that links to the full image. That's pretty much it!
HI Ben,
thank you so much for your help - I think this one is just beyond me - after several days trying (not sleeping too much!!). Could you perhaps give me a quick point in the right direction (which file to look at and maybe a link to a relevant programming reference.) I am only interested in the HTML / Printer Friendly format at the moment and could work it out from there for any others I might need !
Thanks again mate,
Cheers
John
RE: View uploaded pictures in HTML / Printer Friendly Export - Ben - Apr 4th, 2010
Hey John,
Ack, I feel kind of bad about this one. I just sat down to do it and found that there's actually a bug in the Export Manager that prevents the default file upload URL & folder get passed to the template for each field. So it needs a little trickery to figure it out... sorry!
[I logged the bug here, btw: http://bugs.formtools.org/index.php?cmd=view&id=213]
Here's how to do it.
(1) On the Edit Form -> Fields tab, click the "Options" link for your image field. There, click the "Customize" button and select the "File Upload Folder" option in the first dropdown list. That will then display a bunch of info on that row. Don't change anything, just click "update".
What we did here is overwrite the default file upload settings for this particular field - but in fact, we didn't CHANGE anything, so the file upload folder and URL will still be the same as what you defined in the Settings -> Files page. The reason we did this was to force that information to get fed to the export manager so we can use it in the templates (this is the bug!).
(2) Go to Modules -> Export Manager and edit the HTML / Printer-friendly "Table format" export type. Enter the following smarty template content (better back up your old smarty template content, just in case):
Code:
<h1>{$form_name}</h1>
<table cellpadding="2" cellspacing="0" width="100%" class="print_table">
{* display the column headings *}
<tr>
{foreach from=$display_fields item=column name=row}
<th>{$column.field_title}</th>
{/foreach}
</tr>
{* loop through all submissions in this current result set, and display each item in a manner
appropriate to the field type *}
{foreach from=$submissions item=submission name=row}
<tr>
{foreach from=$display_fields item=field name=col_row}
{assign var=field_id value=$field.field_id}
{assign var=field_type value=$field.field_info.field_type}
{assign var=col_name value=$field.col_name}
{assign var=value value=$submission.$col_name}
<td>
{if $field_type == "select" || $field_type == "radio-buttons"}
{smart_display_field_values field_id=$field_id selected=$value}
{elseif $field_type == "checkboxes" || $field_type == "multi-select"}
{smart_display_field_values field_id=$field_id selected=$value multiple=true}
{elseif $field_type == "file"}
{if $form_id == 481 && $col_name == "image_file"}
<a href="{$field.field_info.settings.file_upload_url}/{$value}"><img src="{$field.field_info.settings.file_upload_url}/{$value}" width="100" /></a>
{else}
{$value}
{/if}
{elseif $field_type == "system"}
{if $col_name == "submission_id"}
{$submission.submission_id}
{elseif $col_name == "submission_date"}
{$submission.submission_date|custom_format_date:$timezone_offset:$date_format}
{elseif $col_name == "last_modified_date"}
{$submission.last_modified_date|custom_format_date:$timezone_offset:$date_format}
{elseif $col_name == "ip_address"}
{$submission.ip_address}
{/if}
{elseif $field_type == "textarea"}
{$value|nl2br}
{else}
{$value}
{/if}
</td>
{/foreach}
</tr>
{/foreach}
</table>The bit we're interested in is this:
Code:
{elseif $field_type == "file"}
{if $form_id == 48 && $col_name == "image_file"}
<a href="{$field.field_info.settings.file_upload_url}/{$value}"><img src="{$field.field_info.settings.file_upload_url}/{$value}" width="100" /></a>
{else}
{$value}
{/if}You'll need to change the form ID "48" value to whatever form ID you're interested in and the $col_name "image_file" value to whatever the column name is for your image field [to find that out, just go to the Edit Form -> Database tab].
Once I fix the export manager to always pass along the file upload URL and folders, you'll be able to go and delete the custom settings for that image field. But it's not strictly necessary.
And that's pretty much it... let me know how it goes!
- Ben
RE: View uploaded pictures in HTML / Printer Friendly Export - Hannes - Apr 4th, 2010
Awesome! I was just looking for the same feature.
Works perfect.
I made one small modification ( && $value != null) in order to not display not existing pictures (entries without file):
PHP Code:
{elseif $field_type == "file"}
{if $form_id == 3 && $col_name == "file" && $value != null}
<a href="{$field.field_info.settings.file_upload_url}/{$value}"><img src="{$field.field_info.settings.file_upload_url}/{$value}" width="100" /></a>
{else}
{$value}
{/if}
Thank you a lot!
Hannes.
RE: View uploaded pictures in HTML / Printer Friendly Export - Ben - Apr 4th, 2010
Good call! Glad it's working now.
I really need to improve that module... it's not exactly "user friendly" having to dabble in all that Smarty content... hmm!
- Ben