CSV > JSON > API Mapping Table

Hi everyone, I am trying to create a batch processing app... here is what I am trying to do...

  1. Take a CSV, convert it to a JSON and show it in a table...
  2. Add a new empty row... and a dropdown with set KEYS in thar row of each column of the table...
  3. Add an empty column in the end of the table...
  4. Select in the top row KEYS dropdown what the column VALUES represents...
  5. Run through each row and hit and API with the KEYS+VALUES and populate the last column...

I have done step 1 and I am sure I can do 3,4,5... just not sure how to do 2.

Can you help?

It sounds like you may want to introduce a form component to your app. There's a great guide on that in our docs. When you use the "generate form" option, you'll get a form that has a field and appropriate input for each column in your table (i.e., a dropdown for a set of keys in your column). Do you think this fits your use case?

I am trying to achieve the below... the numbers 1-20 are data filled via a CSV upload (could be numbers or any type of values), I am trying to automatically get the first row to be dropdown with static keys for example (Postcode, Suburb, State, Address, Contents etc) so I can select what each column represents and eventually my goal is to hit an API so I can take what the column means from each row and hit an API and fill the result in the last column...

The csv could contain any number of columns and this app needs to support a top row with a dropdown for each column and I have to select max 5-6 columns but they could be any where in the long list of columns...

Thank you for the example! I have a better sense of what you're trying to accomplish.

Unfortunately, we don't support dropdowns in table headers and rows, but I think I have some recommendations for you:

  • You can still use a Form containing a ListView that maps over your columns and creates a Select component with the options you listed (Postcode, Suburb, State, Address, Contents, etc.). The submit handler can hit your API.
  • If your data always includes one of each column option (Postcode, Suburb, State, Address, Contents, etc.), consider using a transformer to classify and sort your data before feeding it to table.