If you are starting with a table that is sourced from a database and want empty rows that the user can modify, you could create a script that sends an "create record" query to the DB X times with empty strings as the 7 editable columns which would result in X new records, each of which having (essentially) only a primary key (presumably). Then script can trigger the table refresh which would then include those additional records to be edited by the user.
Or, given that you seem to be starting with a blank table (I think that is what you mean by using a data source of [1,2,3,4,5] for the table), you could create a variable (variable1 below) and run a variation of the following script to add N new "rows":
let N = 3 //make this variable in your implementation
let newVarVal = variable1.value
for (let i = 0; i < N; i++) {
const lastItem = newVarVal[newVarVal.length - 1];
newVarVal.push(lastItem + 1);
}
variable1.setValue(newVarVal)
BUT - if you are saving your data to the variable, which is presumably the source of your table, you would need to define the rest of the table columns in the variable as well and account for them in your code.
For my tastes, I would recommend you start with a query to the DB to get the records from the table you are adding to, put those in the table, and then use some variation on approach #1. The second approach might get a bit hairy, depending on what specifically you are trying to do.
I want the client that need help to send his request in a request form.
Example client want to create a «main task/ requests» that has «subtasks/items»
client select a «type» in a a dropdown list
«Type» can be a project, user, car or store
This will be registered in MySql table request
-ReqID
-typeID
-name
-duedate
-createdByUser
-createdDate
user register items user need. It can be 1 item or 500 items. Items can be: users for a project, items to purchase, useres that need access to Retool or parts for for a car.
Makes sense - I would suggest starting with a form component. Within the form, place a select component that allows the user to choose one of the four options (project, user, car, store):
Then add a file input component that allows the user to drop in an Excel file which is parsed into a table component in the form (if the format of the Excel is not always the same depending on the request, you will want dynamic columns):
Then for the "submit" action, you will want to (1) trigger an insert of the new task/request based on the data in the select drop down, and (2) using the ReqID returned by the first insert, trigger an insert of the task details from the table.
The devil is in the details - for example, if the inserts are different for the different types, you will need to use some conditional logic based on the select component - but hopefully this gives you a good start.
Client can delete row if he see that it not needed.
Client can upload pdf files as attachements
Client press send request.
Retool create a record in DB
Point related to my Excel comment was:
When I mention excel. I was thinking of copy information from a excel sheet or word table to ReTool table grid with using Ctrl+C and Ctrl+V. not upload a excel file.
Copy from using Ctrl+C:
Paste to using Ctrl+V:
let N = 3 //make this variable in your implementation
let newVarVal = variable1.value
for (let i = 0; i < N; i++) {
const lastItem = newVarVal[newVarVal.length - 1];
newVarVal.push(lastItem + 1);
}
variable1.setValue(newVarVal)
How can I implement / use the script here om my action button?
You would set the initial value of the variable to [ x ] or however many rows you would like, and the script would be placed as the event action for the button (choose “run script”)
For the data source of your table, you need to use the variable. Then, in your click event for the "add row" button, you run a script (no {{ }} in the script. Like this:
I included a number input where the number of rows to be added can be dynamically controlled. Also included a button that resets the table to [ 1 ]. I exported the app as a JSON so you can play around with it to get used to the process: sandbox.json (28.8 KB)
