Jan 19, 2021 07:53 AM
I’m trying to make a simple repport and wonder if I can make line breaks in a table?
I have tried a few different things like:
output.table([
{'': 'start', '%':0},
{'': 'Halfway', '%':50},
{'': 'finished\ncompleted' , '%':100},
]
)
output.table([
{'': 'start', '%':0},
{'': 'Halfway', '%':50},
{'': 'Delivered<br>Completed' , '%':100},
]
)
output.table([
{'': 'start', '%':0},
{'': 'Halfway', '%':50},
{'': 'Delivered\nCompleted' , '%':100},
]
)
output.table([
{'': 'start', '%':0},
{'': 'Halfway', '%':50},
{'': ['Delivered', 'Completed'] , '%':100},
]
)
output.table([
{'': 'start', '%':0},
{'': 'Halfway', '%':50},
{'': `Delivered
Completed` , '%':100},
]
)
The closest I’ve come to a line break is this:
output.table([
{'': 'start', '%':0},
{'': 'Halfway', '%':50},
{'': [{'Finished': 'Delivered'}, {'Finished': 'completed' }] , '%':100},
]
)
However it’s not user friendly as it just lists two objects, and I just need two stacked strings.
Is it not possible at all to make a line break?
Solved! Go to Solution.
Jan 20, 2021 09:21 AM
No - just use the script block to fabricate a markdown string that contains table properties like this.
UPDATE - not entirely certain you can insert line breaks inside markdown strings, so I may be in err about this. But, the markdown columns should naturally add line wraps given the width of the content and the width of the viewport.
output.markdown('# Record Linking Example');
// select the table
let currentTable = await input.tableAsync('Select a table');
let queryResults = await currentTable.selectRecordsAsync();
let oRecords = queryResults.records;
// build the list
var recordList = "";
for (let record of oRecords)
{
recordList += "- [" + record.name + "](" + currentTable.url + "/" + record.id + ")\n";
}
// render the list
// output.markdown(recordList);
// build the list
var recordList = "| Record ID | Name |\n";
recordList += "| ----------- | ----------- |\n";
for (let record of oRecords)
{
thisName = "";
recordList += "|[" + record.id + "](" + currentTable.url + "/" + record.id + ")|" + record.name + "|\n";
}
// render the list
output.markdown(recordList);
Jan 19, 2021 10:17 AM
Table.output() is not designed for custom rendering of data. If you use output.markdown() and build out the table using markdown tags, you can achieve some degree of newline and wrap control. However, if this is in a script block, you will ultimately hit a ceiling leaving you with three outs:
Jan 20, 2021 08:31 AM
Thank you again Bill…
Do you mean sending it back into a table that supports newline and taking it back into the script again.?
One day I want to ‘graduate’ to React and SDK, however might be a bullet a little too big to bite atm. I tried to get to grips with React, but do not have enough time atm to really get it going.
Jan 20, 2021 09:21 AM
No - just use the script block to fabricate a markdown string that contains table properties like this.
UPDATE - not entirely certain you can insert line breaks inside markdown strings, so I may be in err about this. But, the markdown columns should naturally add line wraps given the width of the content and the width of the viewport.
output.markdown('# Record Linking Example');
// select the table
let currentTable = await input.tableAsync('Select a table');
let queryResults = await currentTable.selectRecordsAsync();
let oRecords = queryResults.records;
// build the list
var recordList = "";
for (let record of oRecords)
{
recordList += "- [" + record.name + "](" + currentTable.url + "/" + record.id + ")\n";
}
// render the list
// output.markdown(recordList);
// build the list
var recordList = "| Record ID | Name |\n";
recordList += "| ----------- | ----------- |\n";
for (let record of oRecords)
{
thisName = "";
recordList += "|[" + record.id + "](" + currentTable.url + "/" + record.id + ")|" + record.name + "|\n";
}
// render the list
output.markdown(recordList);
Jan 21, 2021 03:50 AM
Thank you again @Bill.French I fiddled around with the markdown(). Not ideal but does the job for now.
I’ll have to up my game to React so I can get involved with some custom apps.
Jan 21, 2021 06:11 AM
Indeed, script block is severely limited in terms of UI capabilities. I urge the Airtable team to consider at least adding a sanitized ability to output HTML/CSS into the already sandboxed script block frame. It would allow us to put a nice tidy UX on top of data and computations.
Jan 21, 2021 08:42 AM
+1 for that suggestion