2016-07-25 18 views
0

ドロップダウンリストとJavaScriptを使用して簡単な電卓を作成しようとしていますが、結果を得るのに問題があります。HTML単純なドロップダウンリストと結果

JavaScriptで、設定値がOfficeの場合、1411.21を返すコードを書きました。それ以外の場合は500を返します。 しかし、私が計算ボタンをクリックすると、何もしません。

これは私のHTMLコードです。

<html> 
<form method="post"> 
    <td>Setting : </td> 
     <select name="Setting" id="Setting"> 
       <option value="Office">Office</option> 
       <option value="HOPD">HOPD</option> 
     </select> 

<br/> 

    <td>Facility : </td> 
     <select name="Facility" id="Facility"> 
       <option value="100015">Mount Sinai, 123 Main Street, New York</option> 
       <option value="100016">NYU Medical, 25 North Broadway, New York</option> 
     </select> 




    <table border=1> 
     <tr> 
      <td>Product Size : </td> 
      <td><100sq cm</td> 
     </tr> 

     <tr> 
      <td>Number of DFU patients :</td> 
      <td>10</td> 
     </tr> 

     <tr> 
      <td>Patient co-pay % (based on wage adj.rate) :  </td> 
      <td>20%</td> 
     </tr> 
     <tr> 
      <td>Co-Pay percent actuallly collected : </td> 
      <td>75%</td> 
     </tr> 

     <tr> 
      <td></td> 
      <td> 
      <input type="button" id="button" value="calculate" onclick="settingValue();"> 
      </td> 
     </tr> 
     <tr> 
      <td>Result :</td> 
      <td> 
      <input type="text" id="result" placeholder="result"> 
      </td> 
     </tr> 

    </table> 
</br></br> 


    <table> 
     <tr> 
      <td>Medicare Payment Category</td> <td>High</td> <td>Low</td> 
     </tr> 
     <tr> 
      <td>Medicare Payment</td> <td id="medicarepayment" style="display: none"> 
      <td> 
     </tr> 
    </table> 
</form> 
</html> 

ここには、Javaスクリプトコードがあります。

<script type="text/javascript"> 
     var mydata = { 
      'Mount Sinai': ['100015','123 Main Street','New york'], 
      'NYU Medical' : ['100016,'25 North Broadway','New York] 
      } 
    var firstNum; 
    var secondNum; 
    var settingValue; 

    function settingValue(){ 
     settingValue=document.getElementById("Setting").value; 
     document.getElementById("result").value=medicarePaymentCal(settingValue); 

    } 


    function medicarePaymentCal(value1){ 
     var result; 
     if(value1=="Office"){ 
      return 1411.21; 
     } else { 
      return 500; 
     } 


    } 

    function init() { 
     var button=document.getElementById("button"); 
      button.onclick=medicarePaymentCal(); 
    } 

</script> 

答えて

1

それはあなたがdocument.getElementById("setting").valueを取得しようとしているように見えますが、実際のIDごとのように "設定" で

<select name="Setting"> 
      <option value="Office">Office</option> 
      <option value="HOPD">HOPD</option> 
    </select> 

document.getElementById("Setting").value

EDIT

オクラホマにgetElementByIdをを変更してみてください、あなたのためにJSFiddleを作った: https://jsfiddle.net/dktoxtne/1/

それが動作すれば教えてください!変更したものはすべて覚えていませんが、name="Setting"id="Setting"に変更する必要があることを忘れないでください。

+2

さらに、result要素は読み取り専用と宣言されていますが(これは誤植ですが)、要素は決して閉じられません。 – Devsman

+0

document.getElementById( "Setting")。valueに変更しましたが、それでも動作しません。 –

+0

@Devsmanが示唆しているように、結果入力がタイプミスです。その変更を試してください –

0
function settingValue(){ 
       //settingValue=document.getElementById("setting").value; 
       var e = document.getElementById("Setting"); 
       var settingValue = e.options[e.selectedIndex].value; 
       document.getElementById("result").value=medicarePaymentCal(settingValue); 

      } 
関連する問題