Check out the LimeSurvey source code on GitHub!

Show Results of File Upload Question in Subsequent Question

More
3 years 1 month ago #103347 by dweisser
Hi all,

Using Expression Manager, I can see the results of the file upload question in the survey.
Sorry for reporting - I originally posted in installation issues.

{fileupload.NAOK} =
[{"title":"Starry","size":"0.815","name":"star.gif","filename":"futmp_hai8nxjvd72den4_gif","ext":"gif"}]

Two questions.

1. If I want to show this result in a subsequent question, I think I would need to parse this array, and utilize the URL of the image to present it back to the user.



2. I've read some posts indicating that downloading the uploaded file is problematic. One can manually browse the responses of a live survey and download the image easily enough, but downloading the file directly from the server is a little problematic. Star.gif is chnanged into into fu_456yddyvpxdxzq8 and stored in the survey's directory without a file extension.

If one wanted to use the image in an email template for example, this is problematic.

Perhaps a javascript function could be written to "store the file twice - once as it is for use as LimeSurvey intends it, and again in a secondary location in its orginal form. Perhaps it would be easiest to include a non-native fileupload function for this purpose. Perhaps there is another solution.

Interested in your thoughts on 1 and 2.
Cheers,
David

Please Log in to join the conversation.

More
3 years 1 month ago - 3 years 1 month ago #103376 by tpartner
Regarding #1, as far as I know there is no way to parse that array with Expression Manager but you can with JavaScript.

Add the following to the end of template.js:
function displayUploadedImage(results, imgNumber) {
 
	if($.isArray(results)) { // Only if there is an upload result
 
		var resultsArr = new Array();
		resultsArr = results;
		var imgArr = resultsArr[imgNumber-1];
 
		if(imgArr) { // Only if this image number exists
 
			var imgExtLC = imgArr['ext'].toLowerCase();
			if(imgExtLC == 'gif' || imgExtLC == 'png' || imgExtLC == 'jpg' || imgExtLC == 'jpeg' || imgExtLC == 'tif' || imgExtLC == 'tiff' || imgExtLC == 'bmp') { // Only the file is an image
 
				var surveyRoot = location.pathname.split('index.php')[0];
				var fieldNames = $( 'input#fieldnames' ).attr('value');
				var tmp = fieldNames.split('X');
				var sID = tmp[0];
				var imgFilename = imgArr['filename'];
				document.write('<img src="'+surveyRoot+'index.php/uploader/index/sid/'+sID+'/filegetcontents/'+imgFilename+'" class="pipedImage" />');
			}
			else {
				displayImageError();
			}
		}
		else {
			displayImageError();
		}
 
	}
}
 
function displayImageError() {
	document.write('<span style="color:red">No image found</span>');
}

Then add this script to the question text source where you want the image to appear.
Note: "uploadQuestionCode" is your upload question code and "1" is the image number from that question (in case you allow multiple uploads in the question):
<script type="text/javascript" charset="utf-8">	 displayUploadedImage({uploadQuestionCode}, 1); </script>

Here is a working survey and template (install the template first):

File Attachment:

File Name: Demo_Displ...ages.zip
File Size:117 KB

File Attachment:

File Name: Demo_Displ...ages.lss
File Size:15 KB


.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last Edit: 3 years 1 month ago by tpartner.

Please Log in to join the conversation.

More
3 years 1 month ago #103488 by dweisser
TParter,
Thank you tremendously for this. I haven't yet a chance to implement this solution. I was able to use substr functions to identify the parts of the array that described the image, but you are right, I wasn't able to show the image. Thank you!

This function should allow one to use the uploaded image say in an email template too right?
- Nebraska

Please Log in to join the conversation.

More
3 years 1 month ago #103489 by tpartner
Sadly, I don't think this will work in emails. You need to have a valid session to view the image. (either taking the survey or logged into the backend)

.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
3 years 1 month ago #103493 by dweisser
Understood.
You can reconstruct the file's name and the url of the image using substr and other string manipulation with Expression Manager. What you can't do is "somehow" append the file extension onto the converted file once uploaded.

Is there a way to "branch" the question upload function such that two images are stored? Trigger a function that uploads the file such as is done for the template editor - before the function that stores it in the survey's answer table?

Please Log in to join the conversation.

More
3 years 1 month ago - 3 years 1 month ago #103494 by tpartner

What you can't do is "somehow" append the file extension onto the converted file once uploaded.

Correct, the file is (sort of) encrypted when stored.

Is there a way to "branch" the question upload function such that two images are stored?

Not with JavaScript. It may be possible by hacking the core code but would introduce some security issues - the files would be accessible to everyone.

.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last Edit: 3 years 1 month ago by tpartner.

Please Log in to join the conversation.

More
2 years 5 months ago #112276 by KolyaKorruptis
This script can deal with multiple images, without pre-defining the number.
Call it in your survey endtext or inside a question with:
<script type="text/javascript" charset="utf-8">displayUploadedImage({q99.shown});</script>
...where "q99" is the question code of the image upload in your survey. I suggest to always use the same code for the image upload question.


This goes to the end of template.js:
function displayUploadedImage(results) {
	if($.isArray(results)) { 
		$.each(results, function(i, result) {
			var ext = result['ext'].toLowerCase();
			if(ext == 'gif' || ext == 'png' || ext == 'jpg' || ext == 'jpeg') {
				var surveyRoot = location.pathname.split('index.php')[0];
				var fieldNames = $( 'input#fieldnames' ).attr('value');
				var tmp = fieldNames.split('X');
				var sID = tmp[0];
				var imgFilename = result['filename'];
				document.write('<img src="'+surveyRoot+'index.php/uploader/index/sid/'+sID+'/filegetcontents/'+imgFilename+'" style="max-width:100%" />');
			}
		});	
	}
}
The following user(s) said Thank You: DenisChenu

Please Log in to join the conversation.

More
2 years 5 months ago #112279 by tpartner
Nicely done!

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
2 years 5 months ago #112479 by dweisser
This looks awesome. Unfortunately, I'm getting an error.
Uncaught syntax error: Unexpected token >
<table class="question-wrapper">
        <tr>
          <td class="questiontext">
            <div class="qt_background">
                <span class="asterisk"></span><span class="qnumcode">  </span><p>
	Where is the image?<br />
<script type="text/javascript" charset="utf-8">displayUploadedImage(<span style='background-color: #eee8aa;'><span title='Undefined variable' style='border-style: solid; border-width: 2px; border-color: red;'><span title='Undefined variable' style='color: red; font-weight: bold'>q1403.shown</span></span></span>);</script></p>

Any thoughts?
David

Please Log in to join the conversation.

More
2 years 5 months ago #112493 by tpartner
That indicates an Expression Manager error. Check your question ID.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
2 years 5 months ago #112494 by tpartner
Sorry, I meant question CODE.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
2 years 5 months ago - 2 years 5 months ago #112496 by dweisser
Aha -
So i was using the itemid, not the QCODE. I thought I had it.
Then:
Failed to load resource: the server responded with a status of 404 (Not Found) http://www.springboltconsulting.com/survey/index.php/uploader/index/sid/752182/filegetcontents/fu_3jjg2knf2tpe49t

So, now I can see where the image should be, but it does not load...

It's funny, because I have now implemented both the tpartner solution as well as the KolyaKorruptis. In TParters, I get a message saying "No image found", so I know the script is running. Here is the page source. (I uploaded the picture Jenny.jpg. It shows in the file upload question as intended. Clearly it is being recognized by the script. )
<script type="text/javascript" charset="utf-8">displayUploadedImage([{ "title":"","size":"35.878","name":"Jenny.jpg","filename":"fu_3jjg2knf2tpe49t","ext":"jpg" }]);</script>
<span style="color:red">No image found</span>

What do you think?

David
Last Edit: 2 years 5 months ago by dweisser.

Please Log in to join the conversation.

Imprint                   Privacy policy         General Terms & Conditions         Revocation information and revocation form