Запрет Ajax-вызова, если ввод пуст

Question

Как правильно предотвратить вызов ajax, если кто-то вводит пробел в поле ввода?

Код, который я пытаюсь сделать, выглядел бы примерно так (очевидно, это не работает)

$(document).ready(function() {
  $(document).on('click', '#insert_btn', function() {
    if ($("#first_name").val().length > 0)) {

    $.ajax({
      type: 'POST',
      url: 'add.php',
      datatype: "json",
      data: {
        first_name: $("#first_name").val(),
        last_name: $("#last_name").val(),
        position: $("#position").val(),
        date: $("#date").val(),
        updated: $("#updated").val(),
      },
      success: function(result) {
        if (result == ADD_OK) {
          alert('OK')

        } else {
          alert('wrong');
        }
      }
    })
  });
});

Answer 1

Поскольку вы уже используете jQuery, вы можете перейти к чему-то вроде приведенного ниже кода, где я добавил использование jQuery.trim перед проверкой длины

$(document).ready(function() {
   $(document).on('click', '#insert_btn', function () {

    // Utilizing https://api.jquery.com/jQuery.trim/
    var first_name = $.trim($("#first_name").val());

    if (first_name.length > 0) {

      $.ajax({
        type: 'POST',
        url: 'add.php',
        datatype: "json",
        data: {
          first_name: $("#first_name").val(),
          last_name: $("#last_name").val(),
          position: $("#position").val(),
          date: $("#date").val(),
          updated: $("#updated").val(),
        },
        success: function (result) {
          if (result == ADD_OK) {
            alert('OK')

          } else {
            alert('wrong');
          }
        }
      })
    }
  });
});

JQuery Trim:

jQuery.trim(' ') // returns ""
jQuery.trim('     ') // returns ""
jQuery.trim(' this is my search text      ') // returns "this is my search text"