How a tabbed form silently blocked submissions due to hidden required fields

·2 views

A developer building a site-edit modal split a long form into three tabs, which unexpectedly broke HTML5 form validation. When a required field on an inactive tab was left empty, the browser blocked submission but could not display an error bubble on a hidden element, leaving users with an unresponsive save button. The root cause was that browser-native validation assumes invalid fields are always visible, an assumption that tabbed interfaces break by design. The fix involved adding the novalidate attribute to disable automatic browser blocking, then using JavaScript to detect the first invalid field, switch to its tab, and call reportValidity() manually. This approach preserves all existing validation constraints while ensuring users always see clear, actionable error feedback regardless of which tab they are on.

Read the full story at DEV Community

This is an AI-generated summary. ShortSingh links to the original source for the complete article.

Discussion (0)

How Developers Solved Silence and Lag in AI-Powered Autonomous Live Streams

Developers building an AI avatar live-streaming system identified two core problems: prolonged silence when no viewer comments arrive, and noticeable delays when responding to comments that do. To address dead air, they implemented a fallback mechanism that triggers spontaneous, theme-based speech if 75 seconds pass without any activity — a threshold determined through observation of real streams rather than theory. Viewer screen lag of 15–30 seconds was a key factor in setting that threshold, as shorter intervals caused conversational mismatches between the avatar and incoming comments. The team also built a priority queue to manage utterances, ensuring viewer comment responses always outrank self-generated filler content. The solution shifted the design philosophy from a reactive chatbot model to one that mimics how human streamers maintain engagement even in the absence of audience input.

0 comments Read more at DEV Community

ProgrammingDEV Community ·

The Markdown Database Pattern: Use Plain Files as a Lightweight Database

The Markdown Database Pattern proposes treating a folder of markdown files as a structured database, where each file acts as a record, frontmatter fields serve as columns, and directories function as tables. Tags, wikilinks, and task items in the file body become queryable relationships, enabling a surprisingly capable data layer without any dedicated database software. The approach offers key advantages including portability, Git-based version control, and zero framework lock-in, though it is not designed for large-scale data and lacks true relational joins. It works best for collections of up to roughly 10,000 files, covering use cases like team wikis, blogs, and personal knowledge bases. Tools such as Obsidian Dataview and the open-source MarkdownDB already implement versions of this pattern, and a detailed guide with worked examples is available at wayofmarkdown.com.

0 comments Read more at DEV Community

ProgrammingDEV Community ·

Dev fixes Docker IPv6 healthcheck bug, adds real-time KPI and priority action features

A developer working on a Vite-React and NestJS monorepo resolved a persistent Docker healthcheck failure caused by localhost resolving to IPv6 instead of IPv4 inside the container network. The fix involved replacing localhost with the Docker service name in docker-compose.yml, allowing Docker's internal DNS to route requests correctly to the NestJS server. Alongside the infrastructure fix, a new GET /complex/kpis endpoint was added to aggregate real-time income and expense data for a condos portal dashboard. A priority-action strip called 'Próxima acción' was also built, pulling role-aware task recommendations from a shared NestJS controller without requiring additional database tables. Together, the changes improve DevOps monitoring reliability and deliver live, user-specific insights across the application's three portals.

0 comments Read more at DEV Community

ProgrammingHacker News ·

Terminal-Bench-Science Launches to Test AI Agents on Research Workflows

A new benchmarking framework called Terminal-Bench-Science has been introduced to evaluate AI agents on scientific research workflows. The project aims to assess how well AI systems can handle real-world scientific tasks typically performed in terminal environments. The announcement was shared on Hacker News, where it received modest early engagement. Details about the specific evaluation criteria and supported research domains are available on the project's official website. The initiative reflects growing interest in rigorously testing AI capabilities within specialized scientific contexts.

0 comments Read more at Hacker News