Read here. Code on desktop. The coding workspace opens on screens 1024px and wider.
User interface challenge
Generate Table
easy25 min
Turn two dimension inputs into a numbered table. Practice validating user input and rendering a two-dimensional collection without manually creating DOM nodes.
Requirements
Start with dimension fields containing 2 and 3; render no numbered cells until submission.
Accept integer rows and columns from 1 through 10, inclusive. Whitespace around a number is allowed.
On Generate, replace the table body with the requested number of rows and columns. Number cells from 1 in row-major order.
Assign each cell an ID cell-ROW-COLUMN using zero-based indices. Preserve the table caption and tbody.
For invalid dimensions, remove previous cells and display exactly “Enter whole numbers from 1 to 10.” Clear this message after a valid submission.
Keep the supplied IDs so browser checks can find the controls. Use your selected framework to update the view; do not query or mutate rendered DOM manually.
