I need some help and I think it’s really simple but this is simply cracking my brain. Take a look at the attached file. It’s a list of soccer player names, ages and positions. I’ve figured out how to list the notes in an HTML Table with the player names as the row headings. But when it comes to listing the player names as the Column Headings, I’m totally stuck. It’s not easy to figure out. All the examples and tutorials I’ve come across seem to suggest that there’s quite a bit of coding needed for that. Could anyone take a quick look and let me know Soccer Team.tbx (140.1 KB)
? Thanks so much.
Yes, it’s more work because it is more work! The basic method is, exploiting the document’s outline, exporting each child note as a row. If I understand correctly you want to pivot the table so the existing rows are the columns and vice versa. If so, that means you can’t simply export the outline. In stead you have to read per-child data into per-column list(s) that you can then interesting —in action code—to generate HTML strings you can then inert into your template for export.
Just going into a call so no time to demo but consider that, in the context of ‘Soccer Team’:
var:list vNameList = collect(children, $Name);
// etc. for other fields
...
// now write table HTML
var:string vTableData;
vTableData += "<table>\n";
// etc.
// and now for row #1 of content we make the code like so...
vTableData +="<tr>\n";
vNameList.each(aName){
vTableData += "<td>" + aName + "</td>"
}
vTableData +="</tr>\n";
// now row #2
// when done use ^value(vTableData)^ where you want the table in the template.
You bet; originally, it took me so long (days over weeks) to figure this out. Today, it took about 30 mins to pull together the example. Progress. Happy to share.
The 30 minutes sounds right (I only had 10 minutes before my call thus the incomplete reply).
Bear in mid to do this you need to:
understand the actual HTML tag structure of a table
understand that Tinderbox notes export in outline order
so if not using the order you have to both abstract the necessary data from notes into lists and use the latter to build the HTML in action code rather than inserting attribute values into a template.
understand how to mix action code (^action()^ sections) with more ordinary template content.
So, doing this the first tie will take a while, or—as here, dashing of a demo for someone else using their data.
The next level with this is that if you make the same sort of table often, you might consider making a function so the table creation part can be called from multiple templates. However, don’t jump straight to that stage. A practice I’d suggest for the reader new at this task is to take @satikusala’s TBX, look at how the process works, then go and write your own template to do the same. Actually typing the code & getting the sysntax right is not time wasted: copy/paste doesn’t teach us.
Also to consider, if you care fro look & feel of the web output is the scope for putting in class attributes into the tags to less you leverage CSS (e.g. <th class="t1head"> to apply your CSS .t1head{} style definition to all elements with that class. The ‘t1’ might indicate table style #1, because once you’re doing all this in action code ‘t1head’ might be a string your create on the fly so different tables get different styles.
Tinderbox export is very rich, in terms of what you can do. People over-focus on the the hardness of the first step. But every journey begins with a step and the forum, appositely as in this case, is here to help.
The preview pane is for formatted HTML, i.e. how the rendered code looks. So for pure data export always look at the export pane to pre-export preview your template’s result.
I’ve added CSV versions of both the two existing export forms (i.e. outline and pivoted outline). All new templates include ‘CSV’ in their title. I’ve used a conservative flavour of CSV putting all values in straight double quotes. this allows commas to occur in the exported values (but not straight double quotes).
For good measure i’ve also added TSV (tab-delimted) format template versions too (see ‘TSV’ in template names).
When exporting, select the ‘Soccer Team’ note and file ▸ Export Selected note and when saving the now set a ‘.csv’ file extension for CSV or ‘txt’ for TSV. note the default is ‘.html’ as HTML export is assumed.
This should also answer Can I export JSON/XML/etc… I literally is a matter of:
understanding the rules of the format (e.g. XML, like HTML, element attribute values must use straight double quotes).
inserting the right formatting characters into the right plasce in the model given by the existing templates.
To help later readers, I’ve extended @satikusala’s earlier template whilst adding the CSV and tab-delim template examples.
In the “NamesColumnHeadings” you the user need to build the rows in action code but the format is as at the liked document. Indeed, all I did for the the revised demo was to make 2 copies of the 3 existing templates (a pair for outline based and a single for the pivoted table) and replace the HTML with the relevant formatting.
Today, it took about 30 mins to pull together the example. Progress. Happy to share.