How to a get a URL to a page with a certain option from select tag selected-CodePudding

(I'm not asking how to implement this, but how to create a link for a third party site)

Say a site has an element

<select id="year">
    <option value="2022">2022</option>
    <option value="2023">2023</option>
</select>

The interactions are handled JS/React.

Is it possible to create a URL like https://example.com/#year.option="2022" that will take people to the page with a certain option selected?

CodePudding user response：

there's several ways to achieve this, one way is conditional component rendering when using react:

options.map(option => (
if(option.year == 2022){
<Option data={optionDataProps} >
}
))

*make sure you check the query strings in this component

Furthermore you'd have to implement React Router Dom to render the component

Another Way to achieve is is by doing it serverside in node js could look somewhat like this:

router.get("/api/options", (req, res) => {
const optionYear = req.query.year // "/api/options?year=2022

// then find all options in your DB and return them as JSON for your frontend to receive
})

CodePudding user response：

This is not possible for a third party site, as there is no default browser functionality to achieve this. Form values cannot be prefilled from the URL.