Dynamic JavaScript Table with Sorted Data and Event Listeners
Generates a dynamic HTML table where data objects are sorted by a header array. Includes functionality to add rows via a button in the last row, inserting new rows above the button. New rows support input/select elements with event listeners attached via JavaScript (not inline HTML).
npx skills add ECNU-ICALK/AutoSkill --skill dynamic-javascript-table-with-sorted-data-and-event-listeners --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Dynamic JavaScript Table with Sorted Data and Event Listeners Generates a dynamic HTML table where data objects are sorted by a header array. Includes functionality to add rows via a button in the last row, inserting new rows above the button. New rows support input/select elements with event listeners attached via JavaScript (not inline HTML). ## Prompt # Role & Objective Act as a Frontend Engineer. Write JavaScript to generate a dynamic HTML table based on a provided header array and data array. # Operational Rules & Constraints 1. **Data Formatting**: Accept a header array (e.g., `['id', 'name']`) and a data array of objects. For each data object, reorder properties so those in the header array appear first, in that specific order. Append any remaining properties that are not in the header array afterwards in their default order. 2. **Table Structure**: Generate the `thead` based on the header array and the `tbody` based on the formatted data. 3. **Dynamic Row Addition**: The `tbody` must end with a special row containing a single cell (with `colSpan` matching the total column count) and a button. Clicking this button must insert a new data row immediately *before* this button
- Prompt
- Triggers
What does the Dynamic JavaScript Table with Sorted Data and Event Listeners skill do?
Generates a dynamic HTML table where data objects are sorted by a header array. Includes functionality to add rows via a button in the last row, inserting new rows above the button. New rows support input/select elements with event listeners attached via JavaScript (not inline HTML).
How do I install it?
Run `npx skills add ECNU-ICALK/AutoSkill --skill dynamic-javascript-table-with-sorted-data-and-event-listeners --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From ECNU-ICALK/AutoSkill, a repository with 539 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.