Проверка ввода тега, когда он не заполнен
У меня есть ввод тега, он работает, но без ввода значения, если я нажимаю кнопку отправки, должно отображаться сообщение об ошибке, такое как обязательное поле
$('#form-tags-4').tagsInput({
'autocomplete': {
source: [
'apple',
'banana',
'orange',
'pizza'
]
}
});<link href = "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.min.css" rel = "stylesheet"/>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href = "https://raw.githubusercontent.com/underovsky/jquery-tagsinput-revisited/master/dist/jquery.tagsinput-revisited.min.css" rel = "stylesheet"/>
<script src = "https://raw.githubusercontent.com/underovsky/jquery-tagsinput-revisited/master/dist/jquery.tagsinput-revisited.min.js"></script>
<label>Tags input with autocomplete:</label>
<input id = "form-tags-4" name = "tags-4" type = "text" value = "">
<button type = "submit" id = "save" class = "btn btn-default ">SAVE</button>Вот ссылка ссылка на сайт
пройти через это w3schools.com/js/js_validation.asp
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Сначала вы должны добавить required='required' на ваш input.
После этого вы должны проверить во время события onClick установленное значение и решить, правильное оно или неправильное, в соответствии с исходными значениями автозаполнения.
См. Образец здесь
И переходите ли вы по ссылке, чтобы реализовать проверку при нажатии кнопки с целью проверки формы?
Вам нужно написать собственный javascript для проверки.
function validateForm()
{
var a = document.getElementById("form-tags-4").value;
if (a == "" )
{
alert("Please Fill The Required Field");
return false;
}
}<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>Tags input with autocomplete:</label>
<input id = "form-tags-4" name = "tags-4" type = "text" value = "">
<button type = "submit" id = "save" class = "btn btn-default " onclick = "return validateForm()">SAVE</button>Добавьте теги формы и добавьте «требуется» при вводе.
<form>
<label>Tags input with autocomplete:</label>
<input id = "form-tags-4" name = "tags-4" type = "text" value = "" required>
<button type = "submit" id = "save" class = "btn btn-default ">SAVE</button>
</form>
но входы тегов не работают в скрипке, которую вы указали
Вот рабочий пример jsfiddle.net/lakshmipriya001/swgbpymh/25, которая не работает, если я дам требуемый
Да, у вас есть эта ошибка, потому что Chrome (или другой браузер) не может сфокусировать элемент. Исходный текстовый ввод скрыт плагином.
Итак, вы получите ошибку:
An invalid form control with name='tags' is not focusable.
Плагин использует display: none; в исходном поле, что, я думаю, является ошибкой. Вы можете применить этот CSS, чтобы получить правильное сообщение проверки:
.form-tags-required {
position: absolute;
left: 0;
opacity: 0;
display: block !important;
top: 10px; // depends on your form, adapt it
}
Таким образом можно сфокусировать исходный ввод и получить «требуемую ошибку».
Вам нужно написать собственный js для проверки.