флажок типа ввода, который должен быть истинным или ложным, зависит от данных

#javascript #html #checkbox

#javascript #HTML #флажок

Вопрос:

Я пытаюсь создать флажок, который зависит от базы данных, чтобы показать, должен ли он быть установлен изначально или снят.

Обыгрывается флажок и значение с true / false, 0/1 и «» / пробелами

 $.each(customers, (index, customer) => {
$('#accordionAlarm').append(
`<tr>
<td class="card">

<input type="checkbox" name="checkBox[]" id="1${customer.customerId}" checked="${customer.alarmDateInitial === 'Y' ?  'true' : 'false' }"></input>
<input type="checkbox" name="checkBox[]" id="5${customer.customerId}" checked="${customer.alarmDateFifth === 'Y' ?  'true' : 'false' }"></input>
<input type="checkbox" name="checkBox[]" id="7${customer.customerId}" checked="${customer.alarmDateSeventh === 'Y' ?  'true' : 'false' }"></input>

</td>
</tr>`)
});
  

Ожидаемый:

  • Когда data = Y, флажок установлен
  • Когда data != Y, флажок не установлен

Ответ №1:

checked является булевым атрибутом, что означает, что само его существование указывает на то, что элемент проверен.

Вам необходимо реструктурировать литерал вашего шаблона так, чтобы он включался checked только в том случае, true если условие является, например

 customer.alarmDateInitial === 'Y' ?  'checked' : ''
  

В контексте:

 `<input type="checkbox" name="checkBox[]" id="1${customer.customerId}" ${customer.alarmDateInitial === 'Y' ?  'checked' : '' } ></input>`
  

Ответ №2:

Вы пробовали checked="checked" вместо истинного значения? Вы также могли бы просто возвращать checked вместо установки значения атрибута.