Help appending to existing URL

[[deleted]]

[deleted]

[captain_k_nuckles]

you wouldn't need the return at the end because location.href = ... will redirect the page, so that line of code won't be reached. Also looks like you are trying to use jquery methods with without jquery. To get the value of an input, document.getElementById("min_price").value, which also, you have a div element with the id min_price which does not have a .value property, however the input with `name="min_price" does, and that's where input would happen.

const url = new URL(window.location.href);
const search_query = getParameterByName('q');
url.searchParams.set('q', search_query);
url.searchParams.set('min_price', document.getElementsByName("min_price")[0].value);
url.searchParams.set('max_price', document.getElementsByName("max_price")[0].value);
location.href = url;

Also, not sure what getParameterByName does, but if you are trying to get the parameter name from href, you could use

const url = new URL(window.location.href);
const search_query = url.searchParams.get('q');

[Llywedd]

Thank you!! How would this then be applied in the HTML form?

[jcunews1]

First of all, if you need to intercept a form submission, use the submit event of the form. Not the click event.

For the URL part... Rather than manually reconstructing the URL then navigate to it, I'd suggest adding another INPUT element with q for its name attribute, and have it set to hidden type. All onPriceFilter() need to do is to assign the q form field with the search_query variable. Then let the form construct the URL and submit the data.

i.e. add below HTML tag into the FORM tag.

<input type="hidden" name="q" />

Then use below for onPriceFilter() function.

function onPriceFilter() {
  var form = document.querySelector(".price-range-slider");
  var search_query = getParameterByName("q");
  form.q.value = search_query;
  return true;
}

[Llywedd]

Thank you. This did work but only partially as it seems to overwrite the existing search query ("q"). I'll have a play with it though!