Как правильно валидировать такой хэш-тег?

Question

[Виктор Путин]

Есть такая функция для валидации поля с хэш-тегами - https://codepen.io/viktoraz/pen/KKmqLKK?editors=1010

Хэш-теги должны разделяться пробелом и каждый должен соответствовать шаблону.
1 проблема в том, что регулярка не проверяет каждый хэш-тег, то есть она позволяет ввести первый хэш-тег без решетки, если последний будет с решеткой.
2 проблема заключается в очистке поля. Если ввести любые символы, а потом очистить поле, поле все равно будет не валидным, хотя он пустое (проверял)

Я предполагаю, что проблема просто в регулярке, но перепробовал много разных, ничего не подходит. Может есть другой способ валидировать хэш-теги?

Comments

[Дмитрий Шицков]

Проблема в for_each. Всегда учитывается проверка только последнего в массиве хештега

[Виктор Путин]

Дмитрий Шицков, c for_i та же беда

[Дмитрий Шицков]

Виктор Путин, логично. С любым циклом так будет, пока ваш алгоритм продолжит учитывать лишь проверку последнего. Нужно либо прерывать цикл при первой же ошибке, либо устанавливать флаг, что при проверке были найдены ошибки, либо придумайте какой-то свой вариант

[Виктор Путин]

Дмитрий Шицков, Спасибо! Помог просто выход из цикла при первом false. Так-как цикл будет заново будет запускаться при изменении инпута, все будет хорошо работать. Но вторая проблема осталась :(

[Дмитрий Шицков]

Виктор Путин, про вторую проблему в ответе уже написали.
Где-то до всех теущих проверок, нужно удостовериться что в поле что-то есть

if (hashtagsInput.value === '') {
    hashtagsInput.setCustomValidity('');
    return;
  }

[Виктор Путин]

Дмитрий Шицков, буду теперь более подробней мучать циклы. Спасибо вам за помощь

Answer 1

[Алексей Березников]

Как вариант, вы могли бы сделать чуть более мощную регулярку, допускающую 1 или более валидных хэштегов, разделённых пробелами. Очень грубо - добавить в конец вашей регулярки (перед концом строки) \s* и завернуть всё это дело в ()+.
Например, regex: (#(?<tag>[A-Za-zА-Яа-я]{1,19})\s*)+ (https://regex101.com/r/rfH4AA/1)
Затем достаём все значения группы tag, я в js не силён но думаю должен быть способ.

Comments

[Виктор Путин]

Спасибо, попробую обязательно

[Алексей Березников]

Виктор Путин, обновил ответ примером

Answer 2

[Алексей Дубровин]

Не понимаю в чём проблема типо

if("ПОЛЕ ПУСТОЕ"){
//Не проверяете регуляркой
//Отправляете на сервак
}

Далее вы сказали:

Хэш-теги должны разделяться пробелом

Получаем все хештеги из строки пользователя

let input = "#adsasddasd #adsasdasda #gadsqw-asdas"

let arrHashTag = input.split(" ");

Думаю дальше проверить каждый отдельный элемент на

соответствие шаблону

Не составит труда

Comments

[Виктор Путин]

Я же не просто так оставил ссылку на код. Посмотрите, все там я делаю, но не работает