Как отправить данные формы только из заполненных полей

237
12 декабря 2016, 10:03

Есть форма с разными инпутами

<form action="" method="get">
    <input name="locality"  type="text">
    <select name="currency">
        <option value="">Выбрать</option>
        <option value="RUB">руб.</option>
        <option value="USD">евр.</option>
    </select>
    <button type="submit">submit</button>
</form>

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

Заранее скажу, что нужно отправлять именно методом GET,т.к это запрос на получение данных и нужно иметь возможность поделиться ссылкой

Answer 1

Работает такое решение: перед отправкой, пустые поля делаем disabled.

$('button').click(function(e) {
    e.preventDefault();
    $('input').each(function(){
        if ($(this).val() == '')
            $(this).attr('disabled', true);
    $('select option:selected[value=""]')
        .parent()
        .attr('disabled', true);
    });
    $('form').submit();
});

Может кто-то посоветует что-то лучше?

Answer 2

Попробуйте так

   function disableder (form) {
      var elements = form.elements; // Получаем все инпуты формы
      elements = Array.prototype.slice.call(elements) // превратим в массив
      elements = elements.filter(function (el) { // кнопочки незачем дизейблить
        return !(el.type == 'submit' || el.tagName == 'button');
      });
      elements.forEach(function (el) {
        if(el.value == '') el.disabled = true;
      });
    }

Демо

Тут параметр form, это ссылка на проверяемую форму

READ ALSO
Убрать запятую в конце массива

Убрать запятую в конце массива

Вывожу данные из массиваПри выводе последней строки нужно убрать запятую и пробел (

470
Скролл с конца div

Скролл с конца div

Добрый день!

240