Проверка ввода/типа текста пуста/нуль с помощью jQuery или JavaScript

Я в тупике. Я пытаюсь проверить, является ли мой тип ввода: текст пустым или нулевым в моем JavaScript. В настоящее время у меня есть это:

        if ($("#startDate").val().trim().length() === 0)
    {
        alert("Please fill out the required fields.");
    }

Я пробовал: .val() === "", .val() == "", .length() === 0, .length() == 0, .length() < 1, .val().length() === 0, val().trim().length() < 1, .trim().length() < 1, .text() === "", .text() == "", !$("#startDate").val()

Мой HTML:

<fieldset>
<label for="startDate_[pk]" style="display:block; width:100%;text-align:left">Start Time</label>
<input type="text" name="startDate_[pk]" id="startDate_[pk]" style="width:75px;display:inline" placeholder="pick date" />
@@
<select name="startTime_[pk]" id="startTime_[pk]" style="display:inline;" disabled="disabled">
@{
var time = DateTime.Now.Date.AddHours(8);
for (int i = 480; i < 1260; i += 15)
{
<option value="@i">@DateTime.Now.Date.AddMinutes(i).ToShortTimeString()</option>
}
}
</select>
</fieldset>

Я также пробовал это:

        $('input[class^="dateValidate"]').each(function () {
        if($(this).val().trim().length === 0)
        {
            alert("Please fill out the required fields.");
        }

У меня заканчиваются идеи.

****Обновлять****

Проверка работает для одного выбранного объекта. Но когда вы выбираете более одного, проверка работает только для первого объекта. Вот мой код:

    function validate()
{
    var startDate = $('[id^="startDate"]').filter(function(){
        return $(this).val().length!==0;
    });
    var showingType = $('[id^="tShowingType"]').filter(function () {
        return $(this).val() === "";
    });
    var startTime = $('[id^="startTime"]').filter(function () {
        return $(this).val() === "";
    });
    var endTime = $('[id^="endTime"]').filter(function () {
        return $(this).val() === "";
    });

    if (startDate.length == 0 || showingType.val() === "" || startTime.val() === "" || endTime.val() === "")
    {
        alert("Please fill out the required fields.");
    }
    else
    {
        UI.goToConfirmStep();
    }

Я пытался:

var startDate = $('[id^="startDate"]').filter(function(){
        return $(this).val().length!==0
var startDate = $('[id^="startDate"]').filter(function(){
        return $(this).val().length===0
startDate.length == 0
startDate.length < 0
startDate.length < 1

person Kevin Fischer    schedule 06.07.2015    source источник
comment
Можете ли вы опубликовать HTML, а?   -  person Amit.rk3    schedule 06.07.2015
comment
В чем проблема с тем, что вы пробовали? Они не работают?   -  person Matt Zeunert    schedule 06.07.2015
comment
они не бьют тревогу. он просто терпит неудачу без ошибки.   -  person Kevin Fischer    schedule 06.07.2015
comment
попробуйте это if($("#startDate").val().trim()) это условие должно заботиться о ложной строке (нулевой, неопределенной или пустой)   -  person Sudhansu Choudhary    schedule 06.07.2015
comment
Одно но: $("#startDate").val().trim().length === 0 длина не функция, а свойство. Но я предполагаю, что это опечатка, поскольку вы говорите, что ошибок нет.   -  person dfsq    schedule 06.07.2015
comment
Селектор $("#startDate") не будет выбирать элемент в вашем HTML, который имеет id из: startDate_[pk]; вам понадобится $('#startDate_[pk]') или просто $('input[id^=startDate]').   -  person David says reinstate Monica    schedule 06.07.2015
comment
он работает со всеми моими другими входами, это просто выбор даты   -  person Kevin Fischer    schedule 06.07.2015
comment
[pk] загружается при загрузке, это руководство, которое теряет сознание   -  person Kevin Fischer    schedule 06.07.2015
comment
@KevinFischer обновил мой ответ, попробуйте один раз!   -  person Sudhansu Choudhary    schedule 06.07.2015
comment
к сожалению, @SudhansuChoudhary, это не сработало   -  person Kevin Fischer    schedule 06.07.2015


Ответы (4)


Кажется, у вас есть неправильный идентификатор — startDate в селекторе. В вашем коде у вас есть такие идентификаторы, как startDate_[pk]. Итак, вам нужен селектор starts with, как показано ниже.

 var emptyInputs= $('[id^="startDate"]').filter(function(){
     return $(this).val().length===0;
 });

if(emptyInputs.length>0){
   alert("Please fill out the required fields.");
}

Демонстрация скрипта

person Amit.rk3    schedule 06.07.2015
comment
он попадает три раза, потому что есть три тега с startDate как часть имени - person Kevin Fischer; 06.07.2015
comment
и я не могу изменить имя на данный момент, не изменив массу другого кода. Я думаю, я мог бы попробовать класс и найти это. - person Kevin Fischer; 06.07.2015
comment
хорошо, теперь он не работает с несколькими полями ввода с разными прикрепленными направляющими. Пример: я выбираю один, и проверка работает. но когда я выбираю более одного, проверка работает только для первого, а не для остальных - person Kevin Fischer; 06.07.2015
comment
@KevinFischer: снова обновлено. Не знал этого требования :) - person Amit.rk3; 06.07.2015
comment
честно говоря, не думал, что это сильно изменится! сейчас тестирую. Я на самом деле изменил его на emptyInputs.length ‹ 0 в своем тестовом коде. я обновил свой вопрос вверху для получения дополнительной информации - person Kevin Fischer; 06.07.2015
comment
Я обновил вопрос кое-чем из того, что я пробовал. Он по-прежнему отлично проверяет первый объект (ДА!), но, к сожалению, не проверяет ни один из следующих объектов. - person Kevin Fischer; 07.07.2015

Вы неправильно нацеливаете идентификатор

if(!$("#startTime_[pk]").val())

if (!$('#startTime_[pk]').val()) {
  console.log('input empty');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<input id="startTime_[pk]" type="text" value="" />

Обновить

[pk] на самом деле меняется, потому что это guid, который загружается при загрузке страницы.

Затем используйте селектор начинается с.

if(!$('[id^="startTime"]').val())
person AmmarCSE    schedule 06.07.2015
comment
Я тоже такой пробовал. Забыл это добавить. Добавлю сейчас - person Kevin Fischer; 06.07.2015
comment
@KevinFischer, значит, в вашем коде происходит что-то еще. Я смотрю на фрагмент в моем ответе, он работает - person AmmarCSE; 06.07.2015
comment
@KevinFischer, смотрите мой обновленный ответ, вы неправильно нацеливали идентификатор для данного html - person AmmarCSE; 06.07.2015
comment
[pk] на самом деле меняется, потому что это guid, который загружается при загрузке страницы. - person Kevin Fischer; 06.07.2015
comment
он не попадает в предупреждение, когда в поле ввода ничего нет - person Kevin Fischer; 06.07.2015

length не является функцией. Вот пример приведенного выше кода, работающего за счет удаления скобки после length.

 function validate() {
   if ($("#tShowingType").val() === "" || ($("#startDate").val().trim().length === 0) || ($("#startTime").val() === "") || ($("#endTime").val() === "")) { 
     alert("Please fill out the required fields."); } else { UI.goToConfirmStep();
    }
 }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type='text' id='startDate' />
<button onclick='validate();' >Button</button>

person depperm    schedule 06.07.2015
comment
это не попало в предупреждение и не попало в мое другое - person Kevin Fischer; 06.07.2015
comment
@KevinFischer, что еще за твой jquery? - person depperm; 06.07.2015
comment
` function validate() { //if ($(#tShowingType).val() === || ($(#startDate).val().length === 0) || ($(#startTime). val() === ) || ($(#endTime).val() === )) if (!$('[id^=startTime]').val())// || ($(#startTime).val() === ) || ($(#endTime).val() === )) { alert(Пожалуйста, заполните обязательные поля.); } еще { UI.goToConfirmStep(); } } ` это простая функция. конечный результат объединит эти другие поля ввода, чтобы создать один оператор if для проверки - person Kevin Fischer; 06.07.2015
comment
когда вызывается проверка? - person depperm; 06.07.2015
comment
должен быть пробел после кнопки и перед кликом - person depperm; 06.07.2015
comment
есть. я тут опечатался и исправил - person Kevin Fischer; 06.07.2015

Измените условие на следующее:

if(!$('[id^="startDate"]').val()){
        alert("Please fill out the required fields.");
    }
person Sudhansu Choudhary    schedule 06.07.2015