Change query prameters based on user input

The query string I am dealing with is /table?id=1&year=2018&month=6.

I have a search component with three dropdown fields; id, year and month along with submit button.

On the same page, I have a table below the search component.

For instance, if use selects; id = 2, year= 2015 and month=5 and hit submit, I want the URL to change to /table?id=2&year=2015&month=5.

I've seen different approaches, and also tried a form with GET method, but it did not include the query parameters for some strange reason, the result I got was /table.

I'm sure there is something I am doing wrong or not thinking of, any practical ways of achieving this?

Swaz

7 years ago

Best Answer

Level 20

You'll want to submit your table to the same url using the GET method. I'm going to guess you forgot to put a name attribute on your dropdowns.

<form action="/table" method="get">
    <select name="year">
        <option value="2018">2018</option>
        <option value="2017">2017</option>
    </select>
    <button type="submit">Submit</button>
</form>

dleroari

7 years ago

Level 2

Thanks, I've made this mistake before, and here is why.

My approach (the wrong one)

<form action="/table" method="get">
    <select>
    @foreach($posts->all() as $post)
        <option name="year" value="{{ $post->date->year }}">{{ $post->date->year }}</option>
    @endforeach 
        
    </select>
    <button type="submit">Submit</button>
</form>

When I use foreach, it seems that the option is only one input, and that is why I include the name attribute inside option element instead of the select attribute.

As you mentioned, this is the accurate approach

<form action="/table" method="get">
    <select name="year" >
    @foreach($posts->all() as $post)
        <option value="{{ $post->date->year }}">{{ $post->date->year }}</option>
    @endforeach 
        
    </select>
    <button type="submit">Submit</button>
</form>

Thanks, I was trying all sort of approaches.

Please or to participate in this conversation.