Hello Team Five,
In standard HTML you might have an input tag of type=file to enable form based file uploads.
You might then set the accept parameter to restrict types of files uploaded.
accept=".jpg, .jpeg, .png" // for a selection of image file formats
accept=".csv" // for a standard coma separated values file format
I’m not sure how to achieve a similar result with the built-in file upload field in Five.
Please advise.
Kind regards, Andrew
Hi Andrew,
You can use JavaScript inside Five to get any standard HTML element you want inside Five.
For Eg :
referring the screenshot provided, we’ll identify the element’s ID via the browser inspector, after which I intend to insert my element
Now I wrote this simple code that captures that element and inserts our desired HTML
function addElement(five, context, result) {
let element = document.getElementById('Five-Form-Field-Name')
element.insertAdjacentHTML('afterend', '<input type="file" id="avatar" name="avatar" accept="image/png" />')
return five.success(result);
}
Next, we attach it to a function. I have this simple process with only one field
I attached my function to an event inside the name field.
Now whenever I click on the field and exit out of it ( because I attached it to an On Exit Event ), I create my input element
Let me know if this helps or if you need any other details on this
