2016-04-27 9 views
0

JS、HTML、CSSを使用してPhonegapでリマインダーアプリケーションを構築しています。ユーザーがクリックすると現在スクリーンに「取り込み」ボタンがあります。ユーザーがチェックボックスの形式で服用している薬は、ユーザーがどの薬を服用したかを選択することができます。ここでJSのコードです:ユーザーのチェックボックスの選択に基づいてドロップダウンボックスを表示するか非表示にする

function show(){ 
     document.getElementById("zero").style.display = "inline-block"; 
     document.getElementById("aa").style.display = "inline-block"; 
    } 

function hide() { 
     document.getElementById("zero").style.display = "none"; 
     document.getElementById("aa").style.display = "none"; 
    } 

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

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

そして、ここではHTMLです:だから今、ユーザーは、彼らが自分の薬の少なくとも一つを、取らなかった理由アラートが意志のような理由を選択したときに

<div class="inner" id=text><button onClick="show()">Taken</button> 
</div> 
<div id=aa style="display:none"> 
     <form> 
      <input type="checkbox" name="Medication One" value="one">Supplement One<br> 
      <input type="checkbox" name="Medication Two" value="two">Supplement Two<br> 
      <input type="checkbox" name="Medication Three" value="three">Supplement Three<br> 

       <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="others">Others</option> 
        </select> 
         <input type="submit" onClick="hide()" value="Submit"> 
       </div> 
      <input id=xbutton type="button" onClick="this.style.display='none';validate();showDiv()" value="Submit"> 
     </form> 

    </div> 

「なぜあなたは(投薬名)/(投薬名)を取ったのですか?」と表示されます。理由を選択できるドロップダウンボックスが表示されます。しかし、私がしたいのは、ユーザーがすべての薬を服用していることを意味するすべてのチェックボックスをチェックした場合、ドロップダウンボックスは表示されず、「すべての薬を飲んだことが良い」というアラートだけが表示されます。

私はどのように私のコードにそれを統合するか分からない、任意の助けに感謝します。あなたはすべての入力がチェックされている場合は、あなたが言うことができる書いた同じコードの一部で

答えて

0

if(document.querySelectorAll('input[type="checkbox"]:not(:checked)').length==0) { 
    alert("well done"); 
} 
関連する問題