Как отправить значения true/false через чекбокс?

Написал чекбокс в форме:

<input type="checkbox" name="my_checkbox" value="true">

Но что-то мне подсказывает что value:true передаст строку. Как сделать так, если флажок помечен отправить true, а если не помечен false?


Ответы (2 шт):

Автор решения: SAnton

Передать булево значение нельзя. Когда передается форма на сервер( допустим метод POST), то если есть хоть один выбранный чекбокс, то передастся строка $_POST['my_checkbox']=string("true") в вашем случае true при этом передается как string, а если ничего не выбрано, то просто нет $_POST['my_checkbox'], т.е. isset($_POST['my_checkbox'])результат false

Если у вас в форме будет несколько чекбоксов <input type="checkbox" name="my_checkbox[]" value="true"> <input type="checkbox" name="my_checkbox[]" value="false"> то передаваться будет массив

→ Ссылка
Автор решения: De.Minov

input[type="checkbox"] игнорируется если не имеет состояние checked === true, а если имеет, то отправляет on если value пустое или значение самого value если там что-то указано.

Можно со стороны сервера перепроверять есть ли наличие name данного input'а, и там уже присваивать true\false в зависимости от наличия..
Но думаю это не правильно, т.к. его вообще может не быть.

По этому как вариант предлагаю при отправки формы пересобирать данные для отправки.
Данные записывать в FormData, там проверять наличие input[type="checkbox"] и тут же выдавать записывать его значение как true\false в зависимости от того, какое состояние input.checkbox на данный момент.

document.querySelector('#form').addEventListener('submit', function(form) { // при отправке формы
    form.preventDefault(); // отменяем отправку
    const data = new FormData(); // создаём объект FormData
    const inputs = form.target.querySelectorAll('[name]'); // Собираем все инпуты с атрибутом name
    if(inputs.length > 0) { // Если их больше нуля..
        inputs.forEach(function(input) { // Проходим по ним циклом
            var name = input.name; // получаем значение атрибута name
            var value = input.value; // получаем значение атрибута value
            
            if(input.type === 'checkbox') { // Если инпут == чекбоксу, то..
                value = input.checked; // в переменную value записываем его состояние checked (true || false)
            }
            
            data.append(name, value); // добавляем это в FormData
        })
    }
    console.info(data);
  // Вот тут отправляем данные на сервер
    return false;
})
<form id="form">
  <label>Укажите ваше имя</label>
  <input type="text" name="name" value="Василий"/>
  <br>
  <label>Вы робот?</label>
  <input type="checkbox" name="is-robot" value="true"/>
  <br>
  <input type="submit"/>
</form>


P.s. в примере данные возвращаются в консоль, её откройте девтулом, в сниппете она криво отображает данные.

→ Ссылка