Материализация поиска, автозаполнение. Как изменить сайт в зависимости от выбранной опции? - PullRequest
0 голосов
/ 11 января 2020

Недавно я заинтересовался Материализацией и попытался создать проект, но я борюсь с изменением сайта с помощью автозаполнения.

Я работаю на сайте туристического агентства, и, например, если кто-то выбирает Bahama, я хочу, чтобы он выбрал go для bahamaoffer. html, а если кто-то выбирает Бали для balioffer. html.

Я видел в документации, что вы можете использовать опцию onAutocomplete, которая запускает функцию всякий раз, когда кто-то использует автозаполнение, но я просто не могу понять, какой параметр мне следует там передать.

У меня есть общее представление о том, что я хочу но мне нужен внутренний текст из того, что было выбрано, и я не знаю, как передать этот объект в функцию, которая работает с onAutocomplete.

Я попытался прочитать исходный код и сам это выяснить, но я ' Я новичок, и сейчас это слишком сложно для меня.

Я опубликую некоторый код для вас, чтобы лучше понять.

Прямо сейчас все, что он делает, это то, что пользователь выбирает, он изменяет сайт "Балиоферта. html".

  const autoComplete = document.querySelectorAll('.autocomplete');
  M.Autocomplete.init(autoComplete, {
    data: {
      "Bali": null,
      "Bahama": null,
      "Wyspy Kanaryjskie": null,
      "Ibiza": null,
      "Madagaskar": null,
      "Australia": null,
      "Polska": null,
      "Tybet": null
    },
    limit: 5,
    minLength: 2,
    onAutocomplete: () => {
      window.location = 'balioferta.html';
    }
  });

1 Ответ

0 голосов
/ 12 января 2020

Я решил это сам, и это было действительно просто. Все, что мне нужно было сделать, это поставить один аргумент.

Для дальнейшего использования, если кто-нибудь столкнется с этой проблемой.

const autoComplete = document.querySelectorAll('.autocomplete');
  M.Autocomplete.init(autoComplete, {
    data: {
      "Bali": null,
      "Bahama": null,
      "Wyspy Kanaryjskie": null,
      "Ibiza": null,
      "Madagaskar": null,
      "Australia": null,
      "Polska": null,
      "Tybet": null
    },
    limit: 5,
    minLength: 2,
    onAutocomplete: (res) => {
      let siteHTML = res.toLowerCase() + 'offer.html';
      window.location = siteHTML;
    }
  });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...