Display Google Sheets Data on Interactive HTML Tables (Quick & Easy Setup)

Link to the blog post: www.bpwebs.com...
This video demonstrates how to effortlessly transform your Google Sheets data into dynamic, interactive HTML tables. Using the power of Google Apps Script and the Tabulator library, this process is surprisingly straightforward.
Tabulator provides a wide array of features for filtering, sorting, and more, giving you the ability to create an interactive HTML interface for your Google Sheets data. You can effortlessly enable or disable most of these features without much coding knowledge. If you are searching for an easy setup to display your Google Sheets data on interactive HTML tables, then this is an excellent solution for you.

[@ImamFauzi-vj8xp]

Thanks for the tutorial, really helpful!

[@perrysantos]

excellent!!! thanks for this!

[@zaccoza]

I am grateful for sharing your work. I adapted the project according to my own request. Column 3 entries in the data field have url links. What should I do to make the data come with url links in the web table?

[@SkhemTechNongshli]

Kindly make application that a user login and entry information, and also display only his input or information.

[@SOUVIKKUMAR-vj6wm]

Sir, if i create hyperlink or want to show any weblink from Google, it is not showing or acting like fix value, how to do. Please help

[@THDYoung]

Thank you. Question! If you paste the url of a web app like the one in this video into a Google Site (using 'embed'), then update the data in the spreadsheet associated with the web app, will the Google Site view update automatically or only with a manual page reload?

[@bpwebs]

Manual page reload.

[@etayojuanc]

Friend, do you have any crud data table type applications where the apps script is outside the spreadsheet?

[@jorgetesecum9065]

Mine does not display all the info for example i changed the headers to this: Part Description, Quantity, Location , Condition, Serial Number , Compatibility , Information, Comments , Date/Time ... and only quantity, information and date/time have their data populated in the app, what am i doing wrong ? columns:[ {title:"Part Description", field:"Part Description"}, {title:"Quantity", field:"Quantity"}, {title:"Location", field:"Location"}, {title:"Condition", field:"Condition"}, {title:"Serial Number", field:"Serial Number"}, {title:"Compatibility", field:"Compatibility"}, {title:"Information", field:"Information"}, {title:"Comments", field:"Comments"}, {title:"Date/Time", field:"Date/Time"}, ],

[@user-yq5uu4zq9o]

Can we customize the sheet as per our requirements?

[@bpwebs]

Yes.

[@aa_konovalov]

🔥🔥

[@christopherangeles4916]

Why the body of HTML didn't show up?

[@NdegwaGithigi]

Nice,

[@user-yq5uu4zq9o]

❤❤❤

[@SouravTalukdar-oz6os]

Why Sheet Data Not Showing??

[@airdrop4ufree]

Hi can make step by tutorial

[@SOUVIKKUMAR-vj6wm]

Sir if i want to show any hyperlink or weblink which is in Google sheet, what changes have to do? Because hyperlink or weblink is not working in html table, it shows fix value. Please help

[@bpwebs]

Add formatter:"link" to the relevent column in the createTable function of the JavaScript.html file. E.g. {title:"Type",field:"Type",headerFilter:true, formatter:"link"},

[@SOUVIKKUMAR-vj6wm]

Sir if i want to show any hyperlink or weblink which is in Google sheet, what changes have to do? Because hyperlink or weblink is not working in html table, it shows fix value. Please help

[@bpwebs]

Add formatter:"link" to the relevent column in the createTable function of the JavaScript.html file. E.g. {title:"Type",field:"Type",headerFilter:true, formatter:"link"},