transloadit

Assembly variables using form field name based from its file name in Transloadit

I'm currently working on uploading multiple files with each generated name passed through form fields. The problem I'm having now is since I'm uploading multiple files I'm going to need dynamic form fields.

e.g. Uploading single image - which I'm not having trouble

HTML

<input type="hidden" name="item-id" id="item-id" value="1234">
<input type="hidden" name="fileName" id="fileName" value="zeahgvyg">

Template

 "store_original": {
   "robot": "/s3/store",
   "use": [
     ":original"
   ],
   "key": "xxxxxxxxxx",
   "secret": "xxxxxxx",
   "bucket": "mybucket",
   "path": "${fields.item-id}/${fields.fileName}_original.${file.ext}"
 },

file path result : 

1234/zeahgvyg_original.jpg

Now Uploading multiple images - which I'm having trouble now

Since number of files depends on the user, I'm going to check that through JS and append the form fields with their generated names

JS

// fileuploaded : cat_thumbnail.jpg
// then process to get file basename
// fileName = cat_thumbnail

var fileGeneratedName = "newfilename"; 
var newInput = $("<input type='hidden' name='"+fileName+"' id='"+fileName+"' value='"+fileGeneratedName+"'/>");
$('#hiddenFileNames').append(newInput);

Template

 "store_original": {
   "robot": "/s3/store",
   "use": [
     ":original"
   ],
   "key": "xxxxxxxxxx",
   "secret": "xxxxxxx",
   "bucket": "mybucket",
   "path": "${fields.item-id}/${fields.${file.basename}}_original.${file.ext}"
 },

So obviously the line that didn't work is this one 

   "path": "${fields.item-id}/${fields.${file.basename}}_original.${file.ext}"

My question now is how should I call a form field based from the filename?

reference for other variables : https://transloadit.com/docs#assembly-variables

${file.ext} and ${file.basename}
Solution

  • Speaking as a cofounder, Transloadit launched the feature as you describe on Dec 15th 2014.