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

Question

Я создаю приложение напоминаний о лекарствах, и оно работает щелчком пользователем по кнопке, и система отобразит лекарство, которое должен принимать пользователь в зависимости от текущего времени. И скажите, должен ли пользователь принимать Med A и Med B в 3 часа дня, а когда пользователь нажал кнопку в 3 часа дня, появятся два флажка с Med A и Med B, но если пользователь только проверил «Med A», система должна покажите сообщение с вопросом: «Почему вы не взяли Med B?» с dropbox, позволяющим пользователю выбирать причину.

Однако на данный момент, если пользователь только проверил «Med A», система отобразит сообщение с вопросом: «Почему вы не взяли Med B и Med C», поскольку Med C также указан как один из вариантов для checkbox, так, чтобы он не отображался так, как следует в другое время. Поэтому не имеет значения, какое лекарство должен принимать пользователь в любое конкретное время, система всегда будет запрашивать на основе всех опций флажков, а не на основе текущих отображаемых флажков (которые отображаются по времени).

JS:

function validate() { 
     var msg = []; 
     [].forEach.call(document.querySelectorAll('input[type="checkbox"]:not(:checked)'), function(elem, index) { 
         msg.push(elem.name); 
         }); 
         navigator.notification.alert(msg.length ? 'Why didnt you take ' + msg.join(' and ') : 'Well done, you have taken all the medications!', alertDismissed, 'Message for you:','Done'); 

     } 

    function showDiv(){ 
     if(document.querySelectorAll('input[type="checkbox"]:not(:checked)').length==0) { 
      hide(); 
     }else{document.getElementById('welcomeDiv').style.display = "block";} 
    } 

    function myFunction(){ 
     var hour = (new Date()).getHours(); 
     showMed('A', hour == 15); 
     showMed('B', hour == 15); 
     showMed('C', hour == 19); 
    } 

    function showMed(med, show) { 
     document.getElementById('med' + med).style.display = show ? '' : 'none'; 
    } 

HTML

<div class="inner" id=text><button onClick="myFunction()" >Check</button></div> 

</div> 
    <div id=aa style="display:none"> 
     <form> 
      <div id='medA'> 
       <input type="checkbox" name="Med A" value="A">Medication A 
      </div> 
      <div id='medB'> 
       <input type="checkbox" name="Med B" value="B">Medication B 
      </div> 
      <div id='medC'> 
       <input type="checkbox" name="Med C" value="C">Medication C 
      </div> 

       <div id="welcomeDiv" style="display:none;" class="dropdown" title="Basic dialog"> 
        <select> 
         <option value="" disabled="disabled" selected="selected">Please choose one</option> 
         <option value="forget">Forget to take</option> 
         <option value="notfeeling">Not feeling like taking it</option> 
         <option value="sideeffect">Worried about side-effects</option> 
         <option value="sideeffect">Run out of supplements</option> 
         <option value="misclick">Misclick</option> 
         <option value="others">Others</option> 
        </select> 
         <input id="btnbutton" class="btn" type="button" onClick="know();hide()" value="Submit"> 
       </div> 
      <input id=xbutton type="button" onClick="validate();showDiv()" value="Submit"> 
     </form> 

Answer 1

Вы можете могли не добавить, что имя в список лекарства, если это флажок не отображается. Для его исправления должно быть достаточно одного изменения кода (показано ниже).

var valid = true; 

function validate() { 
     var msg = []; 
     [].forEach.call(document.querySelectorAll('input[type="checkbox"]:not(:checked)'), function(elem, index) { 
         msg.push(elem.name); valid = false; 
         }); 
if(!valid) { 
         navigator.notification.alert(msg.length ? 'Why didnt you take ' + msg.join(' and ') : 'Well done, you have taken all the medications!', alertDismissed, 'Message for you:','Done'); } 

     } 
} 

function showDiv(){ 
      if(valid) { 
      hide(); 
     }else{document.getElementById('welcomeDiv').style.display = "block";} 
}