Cleaning up URL before appending query parameters

I have a search box in my navbar that filters all of the listings with the following code (essentially the equivalent of form_tag, but using simple_form and the ':search' symbol): <%= simple_form_for :search, url: listings_path, method: :get do |f| %> <div class='input-group'> <%= f.input :address, label_html: { class: 'sr-only' }, label: 'Address', id: 'search_address', placeholder: 'Where do you want to be?', input_html: { value: session[:address] }, required: false %> <span class='input-group-btn'> <button class='btn btn-primary' type='submit' aria-hidden='true' aria-label='Search'><i class='fa fa-search'></i></button> </span> </div> <% end %> This generally works and produces a URL with the search parameter added. For example: http://localhost:3000/listings/?utf8=%E2%9C%93&search%5Baddress%5D=London%2C+United+Kingdom This URL provides the listings index filtered by the location (e.g., London, UK). However, once I go to another page, say, listing 13, and try to search again using the search box in the navbar, the query parameters are appended to the current URL. For example: http://localhost:3000/listings/13?utf8=%E2%9C%93&search%5Baddress%5D=London%2C+United+Kingdom (Note the listing id 13 before the question mark.) This obviously does not take me back to the listings index with the location filter applied. But I can remove the '13' from the URL and get: http://localhost:3000/listings/?utf8=%E2%9C%93&search%5Baddress%5D=London%2C+United+Kingdom This URL does work as expected. How can I specify that the URL should be the listings index path (i.e., http://localhost:3000/listings/) plus the query parameters? That is, how can I drop all of the parameters except for the query parameters? Thanks!

Posted about 4 years ago by Chlump Chatkupt
Posted about 4 years ago by Chlump Chatkupt

I figured it out. The problem is caused by the Bootstrap form class code surrounding my search box partial:

<form class="navbar-form navbar-left" role="search">

...

</form>

Removing the form class code fixes the issue, and the search box works as expected. But I had to define a custom div class to make the search box fit and to position it properly.

Not sure why the form class broke the search function, though.

1
Posted about 4 years ago by Alex Yang

Yeah, that seems a bit strange to me as well. Glad it's working now though!

1
Posted about 4 years ago by Chlump Chatkupt

I cleaned up the code a little by creating a separate page for search results (/listings/search), adjusting the routes, and moving the filter logic from the index action to the search action.

Now I wonder whether there is a simple way to replace everything in the URL after 'listings/' with 'search' and then appending the query parameters. That way, I can generate the correct URL.

For example: http://localhost:3000/listings/search?utf8=%E2%9C%93&search%5Baddress%5D=London%2C+United+Kingdom

instead of:

http://localhost:3000/listings/13?utf8=%E2%9C%93&search%5Baddress%5D=London%2C+United+Kingdom

(Here, changing '13' to 'search'.)

1
Posted about 4 years ago by Alex Yang

This is certainly doable. If you've already set up the 'search' route in your config/routes.rb file, then you just need to make sure your form is submitting to the right path. In your code, it looks like the form is currently submitting to the 'listings_path' url when you actually want to submit to the search URL (I'm not sure about the name of the path that you've set this up to use). With this change, the submitted form parameters should all be appended to your search URL. Hope that helps!

1
Posted about 4 years ago by Chlump Chatkupt

Thanks, Alex. I forgot to mention that I changed the URL in the form:

<%= simple_form_for :search, url: search_listings_path, method: :get do |f| %>

Here is my routes.rb:

resources :listings do

collection do

get 'search'

end

resources :orders, only: [:new, :create]

end

And rake routes:

search_listings GET /listings/search(.:format) listings#search

I must be missing something simple.

1
Posted about 4 years ago by Alex Yang

From what you've told me so far, it sounds like it should be working. Maybe try restarting your server, if you haven't already?

Otherwise, you should check your Rails server to confirm that the GET request is being sent to the 'search_listings' route. I can't think of any reason why submitting the form would take you to the Show Listing route (e.g. http://localhost:3000/listings/13?...).

1
Posted about 4 years ago by Chlump Chatkupt

Still not working:

Started GET "/listings/13?utf8=%E2%9C%93&search%5Baddress%5D=London%2C+United+Kingdom" for ::1 at 2015-08-29 18:51:16 +0100

Processing by ListingsController#show as HTML

Parameters: {"utf8"=>"✓", "search"=>{"address"=>"London, United Kingdom"}, "id"=>"13"}

Not sure why the listing ID is still in the URL, why it is being passed as a parameter, and why the 'show' action is processed instead of 'search'.

I have even edited the form to use the 'search' action specifically: <%= simple_form_for :search, url: search_listings_path, controller: 'listings', action: 'search', method: :get do |f| %>

This generates the HTML: <form novalidate="novalidate" class="simple_form search" action="/listings/search" accept-charset="UTF-8" method="get"><input name="utf8" type="hidden" value="&#x2713;" />

The action is explicitly 'listings/search' also.

Not sure what else to check.

1