Здравствуйте, уважаемые античатовцы. Скажите, пожалуйста, как запретить запускать скрипт, пока не заполнено поле и не содержит от 3 знаков? На уровне html5 я добавлял в input: pattern=".{3,50}" required="required", но это можно удалить в браузере - небезопасно. Дело в том, что достаточно кликнуть кнопку поиска с пустой строкой и скрипт долго грузит и выводит все значения из базы - слишком большая нагрузка. Я вот думаю, что можно использовать и вариант ограничения загрузки значений из базы - например, максимум 100, но, мне кажется, это сделать будет уже сложнее. HTML: <div class="col-md-3 ml-auto"> <form class="ajaxSearchItem input-icon my-3 my-lg-0" method="POST" action="<?=cn(segment(1)."/ajax_search/keyword")?>"> <div class="form-group"> <div class="input-group"> <input type="text" class="form-control" name="k" placeholder="<?=lang("Search_for_")?>"> <span class="input-group-append"> <button class="btn btn-secondary" type="submit"><i class="fe fe-search"></i></button> </span> </div> </div> </form> </div> Code: // callback ajaxSearch $(document).on("submit", ".ajaxSearchItem" , function(){ pageOverlay.show(); event.preventDefault(); _that = $(this); _action = _that.attr("action"); _data = _that.serialize(); _data = _data + '&' + $.param({token:token}); $.post( _action, _data, function(_result){ setTimeout(function () { pageOverlay.hide(); $("#result_ajaxSearch").html(_result); }, 300); }); })
Если вопрос именно в проверке напечатанного текста в input, то самый простой способ это проверить - получить текст инпута и, где-то в начале колбэка, проверить его длину Code: const inputText = $('input.form-control')[0]; // тут лучше использовать id для селектора if (inputText?.value?.length >=3) { } else { // TODOs }
но это можно удалить в браузере - небезопасно. так в чем проблема перед запуском скрипта проверить параметры строки на беке?
Или в джс в начало онсабмит написать callback ajaxSearch $(document).on("submit", ".ajaxSearchItem" , function(e){ if ($(“#search_id”).value.length < 3){ e.preventDefault() }