Домашнее задание к занятию 2.2 «Работа с HTML-формами».
Необходимо дописать удобное управление списком интересов для профиля пользователя.
- Основная HTML-разметка
- Базовая CSS-разметка
- Часть написанного кода JS
Реализация представляет собой HTML-обёртку над тегом select:
В существующей реализации необходимо доработать метод getMatches
getMatches( text ) {
/*
TODO: этот метод нужно дописать
text - фраза, которую вводят в поле поиска
Метод должен вернуть массив.
Он формируется на основе списка опций select-элемента (this.input)
Подходящие опции - те, чей текст содержит то, что есть в аргументе text
Необходимо вернуть массив объектов со свойствами:
{
text: 'Содержимое <option>',
value: 'Содержимое атрибута value'
}
*/
return [
{
text: 'Чубакка',
value: '1'
}
];
}
В экземпляре класса Autocomplete имеется свойство input, которое указывет на тег select. Его необходимо использовать для обхода по всем опциям списка.
Используемые темы
- Свойство options тега select
- Метод includes
Советы
Для получения всех опций тега select достаточно обратиться к this.input.options
- Допишите метод getMatches
- Получайте удовольствие :)
- Перейти в папку задания.
cd ./html-forms/autocomplete
. - Открыть файл
task.js
в вашем редакторе кода и выполнить задание. - Открыть файл
task.html
в вашем браузере и убедиться в правильности выводимых результатов. - Добавить файл
task.js
в индекс git с помощью командыgit add %file-path%
, где %file-path% - путь до целевого файла.git add task.js
. - Сделать коммит используя команду
git commit -m '%comment%'
, где %comment% - это произвольный комментарий к вашему коммиту.git commit -m 'first commit autocomplete'
. - Опубликовать код в репозиторий homeworks с помощью команды
git push -u origin master
. - Прислать ссылку на репозиторий через личный кабинет на сайте Нетологии.
Никаких файлов прикреплять не нужно.
Все задачи обязательны к выполнению для получения зачета. Присылать на проверку можно каждую задачу по отдельности или все задачи вместе. Во время проверки по частям ваша домашняя работа будет со статусом "На доработке".
Любые вопросы по решению задач задавайте в чате учебной группы.