I'm hoping for some guidance here, a little out of my depth here, but looking to have a filedropzone, where a user drops or selects a file, the button would trigger a (popup?) for confirmation which column contains the emailadress and if the first row contains a header.
I am assuming that I can use the next query to update with those inputs into this script:
function csvToJson(csvString) {
const lines = csvString.split('\n');
const headers = lines[0].split(',');
return lines.slice(1).map(line => {
const values = line.split(',');
return headers.reduce((row, header, index) => ({
...row,
[header.trim()]: values[index].trim() // trim to remove any leading/trailing spaces
}), {});
});
}
Hey @Michael_Rockwell! Would you mind sharing some screenshots of your current setup?
For the pop-up, I added an event handler to the file input component to open a Modal component. In the Modal component, I set the Hidden property to true so the Modal button isn't actually visible on the app anywhere.
For the code section, what is your goal and what value are you inputting into the function? Are you parsing the inputted files?
If so, you get access to fileDropzone1.parsedValue, which has the CSV's parsed headers and values.
Hi Victoria,
I have used your Modal suggestion as I am trying to do something similar. I would like to be able to create CSV mappings which can be named and saved for future use. This feature would need to list the headers in the uploaded CSV file with each field having a dropdown mapping for pre-defined fields. I think this is a basic field mapping UI, hopefully I have explained it ok. I am a developer but new to Retool. I just need some guidance on how to achieve this.
Thanks!
