Updates to my Table Sorting Web Component / / No Comments It’s been a while since I touched my <table-sort> web component, but last night I had a few interesting ideas and thought I’d do a quick update. For folks who may not remember, I first blogged about this way back in March of 2023. The basic idea was to take an existing table, wrap it in my web component, and sorting would be added automatically. Nice and simple. As an example: <table-sort> <table> <!-- existing table here --> </table> </table-sort> The only real "feature" was that if you included numeric="X", it would consider the Xth column as numeric and ensure sorting worked properly. X in this context could be one column,... more → Posted in: JavaScript Tagged with: Component, Sorting, table, updates
Sorting Out Your Monarchs with BoxLang / / No Comments I know what you’re thinking right now – a monarch problem? How did Raymond know I had a monarch problem? What can I say, with great age comes great wisdom, or, more likely, random code challenges. I’ve mentioned "rendezvous with cassidoo" before as one of the newsletters I subscribe to. Authored by the very interesting Cassidy Williams, this short and sweet newsletter always has interesting content and always ends with a basic code challenge, what she calls her ‘interview question of the week’. This weeks question was pretty fun: Given an array of strings representing the names of monarchs and their ordinal numbers, write a function that returns the list... more → Posted in: JavaScript Tagged with: BoxLang, Monarchs, Sorting
Update to My Table Sorting Web Component / / No Comments Just a quick note. Last year, I blogged a demo of a web component that lets you wrap an existing HTML table and progressively add table sorting. I’m rather proud of that demo and was actually planning on doing a quick video about it, but while testing I encountered two small bugs that somehow missed my earlier rigorous testing. (And by rigorous testing I mean a few minutes of clicking around.) Specifically, the issue is in the "when clicking to sort, notice if we sorted this column before and if so, reverse the sort" area: sortCol(e,i) { let sortToggle = 1; if(this.lastSort === i) { this.sortAsc = !this.sortAsc; if(!this.sortDir) sortToggle = -1; } this.lastSort = i; this.data.sort((a,b)... more → Posted in: JavaScript Tagged with: Component, Sorting, table, update
Building Table Sorting and Pagination in Alpine.js / / No Comments A few months back, I realized that one of my most popular blog posts (Building Table Sorting and Pagination in Vue.js) would be an excellent opportunity to update for a more plain (or vanilla if you will) JavaScript version. That post (Building Table Sorting and Pagination in JavaScript) was pretty fun to write. As much as I enjoyed using Vue over the past few years, I find myself more and more trying to rely less on external frameworks and sticking to simpler methods of getting things done. That being said… I am also really intrigued by Alpine.js. Raymond Camden… more → Posted in: JavaScript Tagged with: Alpine.js, building, Pagination, Sorting, table
Building Table Sorting and Pagination in JavaScript / / No Comments As part of my job in managing this blog, I check my stats frequently, and I’ve noticed that some of my more basic Vue.js articles have had consistently good traffic for quite some time. As I find myself doing more and more with "regular" JavaScript (sometimes referred to as "Vanilla JavaScript", but I’m not a fan of the term) I thought it would be a good idea to update those old posts for folks who would rather skip using a framework. With that in mind, here is my update to my post from over four years ago, Building Table Sorting and Pagination in Vue.js Raymond Camden… more → Posted in: JavaScript Tagged with: building, JavaScript, Pagination, Sorting, table