diff --git a/app/frontend/controllers/address_autocomplete_controller.js b/app/frontend/controllers/address_autocomplete_controller.js index e8312fbc2..22da81e67 100644 --- a/app/frontend/controllers/address_autocomplete_controller.js +++ b/app/frontend/controllers/address_autocomplete_controller.js @@ -4,16 +4,16 @@ import 'accessible-autocomplete/dist/accessible-autocomplete.min.css' const options = [] -const fetchOptions = async (query) => { - const response = await fetch(`/address_options?query=${query}`) +const fetchOptions = async (query, searchUrl) => { + const response = await fetch(`${searchUrl}?query=${encodeURIComponent(query)}`) const data = await response.json() console.log(data) return data } -const fetchAndPopulateSearchResults = async (query, populateResults, populateOptions, selectEl) => { +const fetchAndPopulateSearchResults = async (query, populateResults, searchUrl, populateOptions, selectEl) => { if (/\S/.test(query)) { - const results = await fetchOptions(query) + const results = await fetchOptions(query, searchUrl) console.log(results) // address and uprn keys returned per result populateOptions(results, selectEl) populateResults(Object.values(results).map((o) => o.address)) @@ -35,6 +35,7 @@ const populateOptions = (results, selectEl) => { export default class extends Controller { connect () { + const searchUrl = JSON.parse(this.element.dataset.info).search_url const selectEl = this.element accessibleAutocomplete.enhanceSelectElement({ @@ -42,7 +43,7 @@ export default class extends Controller { selectElement: selectEl, minLength: 1, source: (query, populateResults) => { - fetchAndPopulateSearchResults(query, populateResults, populateOptions, selectEl) + fetchAndPopulateSearchResults(query, populateResults, searchUrl, populateOptions, selectEl) }, autoselect: true, showNoOptionsFound: true, diff --git a/app/views/form/_address_autocomplete_question.html.erb b/app/views/form/_address_autocomplete_question.html.erb index b6b8569ee..e151406c2 100644 --- a/app/views/form/_address_autocomplete_question.html.erb +++ b/app/views/form/_address_autocomplete_question.html.erb @@ -5,6 +5,7 @@ <%= f.govuk_select(question.id.to_sym, label: legend(question, page_header, conditional), "data-controller": "address-autocomplete", + "data-info": { search_url: address_options_url }.to_json, caption: caption(caption_text, page_header, conditional), hint: { text: question.hint_text&.html_safe }) do %> <% if answers.any? %>