card: network select

WHAT IT DOES

This tool scans any webpage to detect every HTML select element (dropdown) and analyze its complete structure. For each select found, it displays the name attribute, id, element selector, DOM path, total option count, and whether it supports multi-select. All available options are shown with their values and text content, with currently selected options visually highlighted in the list. The tool identifies form association and validation attributes including required, disabled, and size. A powerful search filter lets you find selects by name, id, option text, value, or selected state. You can export the complete options data from any select in three formats: JSON (structured data with all properties), CSV (for spreadsheet import), or HTML (reproducing the select markup). The inspector mode lets you click any select on the page to see its complete attributes, all options with their selected states, and current value in a detailed alert dialog.

WHERE IT RUNS

The script runs on every website and web application you visit. It works with all HTML select elements regardless of framework—React, Vue, Angular, Svelte, or plain HTML. It captures both native select elements and framework-wrapped dropdowns, and accurately reports their current state, selected values, and all available options as they appear in the live DOM.

HOW TO USE

Upon installation, a floating panel appears with the tool interface. Click "Scan" to analyze the current page for all select elements. Use the search box to filter results by name, id, option text, value, or selector. Notice that each entry shows the select name or id, option count, and badges for multi-select, disabled, required, and selected count. The options list displays each option's value, text, and a checkmark if selected. Select your preferred export format (JSON, CSV, or HTML) from the dropdown, then click "Export" on any entry to copy that select's data to your clipboard. Click "Highlight" to scroll to and emphasize the select on the page. Hover over any entry in the panel to highlight that select on the page with a blue outline. Click "Inspect" to enter inspector mode, then click any select on the page to see a detailed report including its name, id, selector, multi-select status, option count, selected count, and a complete list of all options with their values, text, and selected state. Click "Inspect" again or press Escape to exit inspector mode.

TECHNICAL MECHANISM: SELECT ELEMENT TRAVERSAL WITH OPTION EXTRACTION

This tool performs a comprehensive DOM traversal that selects every select element in the document using querySelectorAll('select'). For each select found, it iterates through the options collection using the DOM OptionsCollection API, extracting each option's value, text content, selected state, and disabled state. The selected values and selected texts are collected by checking the selected property of each option, with support for both single-select and multi-select behavior. The tool captures the select's name, id, form association (via the form property), and validation attributes (disabled, required, multiple, size). The DOM path is constructed by walking up the ancestry chain and building a CSS-like selector at each level. The export functionality formats the options data into JSON (full structured data), CSV (flat table of value, text, selected), or HTML (recreating the complete select markup with all options and attributes). The scanning process is efficient and completes in a single pass, providing near-instant results even on pages with many select elements.

THE PANEL

The panel is fully draggable and remembers its position per website using GM_setValue. It automatically snaps to the nearest screen edge when released for a clean workspace. Click the collapse button to minimize it to a small floating bubble that takes minimal space. Click the bubble to expand the panel back. The panel can be resized by dragging any edge or corner. Press the Escape key to close the panel temporarily, and click the extension icon to reopen it.

PLEASE NOTE

This script requires the free BotGentz extension to function. As websites frequently update their structure and form handling, scripts may need occasional updates to maintain compatibility. All data processing happens locally in your browser—no information about your pages, selects, or browsing habits is ever transmitted or stored externally. The tool accesses page content solely for the purpose of select detection and analysis, and does not modify or persist any page data. Exported data is copied directly to your clipboard and is not sent anywhere else.