Блог

У меня есть такой же тумблер, как этот:

И Active метка взята из базы данных. Я хочу, чтобы эта кнопка была изменена на true , если она активна.

Это то, что я пробовал до сих пор:

HTML

 lt;input onclick='toggleStatus(this)' type='checkbox' id='{{ db.id }}' name='{{ db.id }}'gt; lt;label id='user-status-toggle' for='{{ db.id }}'gt;{{ db.status }}lt;/labelgt;   

язык JavaScript

 function toggleStatus(radio) {  var toggle = document.getElementById('user-status-toggle');   if (radio.checked) {  toggle.textContent = "Active";  radio.checked = true;  } else {  toggle.textContent = "Inactive";  radio.checked = false;  } }  

Это работает, но только когда я взаимодействую с кнопкой. Когда я впервые посещаю страницу, она всегда выключена, даже если статус активен. Обратите внимание, что у меня может быть несколько кнопок, и их статус может варьироваться от Active и Inactive до .

Так как же мне это сделать?

Я исправил это, проверив, если db.status === "Active" первый с помощью оператора if-else в PHP:

 if (db.status === "Active") {  return lt;input checked onClick=toggleStatus(this)'gt; } else {  return lt;input onClick=toggleStatus(this)'gt; }  

Вы можете установить начальный checked на своем lt;input /gt;

просто добавьте checked атрибут.

например,

 // if this one is what you want initial checked.. lt;input checked onclick='toggleStatus(this)' type='checkbox' id='{{ db.id }}' name='{{ db.id }}'gt; lt;label for='{{ db.id }}'gt;{{ db.status }}lt;/labelgt; lt;input onclick='toggleStatus(this)' type='checkbox' id='{{ db.id }}' name='{{ db.id }}'gt; lt;label for='{{ db.id }}'gt;{{ db.status }}lt;/labelgt;   

Я не очень хорошо разбираюсь в PHP, но, думаю, это было бы неплохо..

 // if this one is what you want initial checked.. lt;input checked='{{ db.textContent === "Active" }}' onclick='toggleStatus(this)' type='checkbox' id='{{ db.id }}' name='{{ db.id }}'gt; lt;label for='{{ db.id }}'gt;{{ db.status }}lt;/labelgt;