Скидка с событием (onChange) Javascript не работает?

Question

У меня есть страница Скидка с Javascript, этот Сценарий

<script> 

      function hitung() 
        { 
        var x = document.getElementById('TOTAL').value; 
        var y = document.getElementById('DISKON').value; 

        var besarDiskon = x * (y/100); 


        var grandTotal = x - besarDiskon; 

        document.getElementById('GTOTAL').value = grandTotal; 

        } 

    </script> 

    <input type='text' name='TOTAL' size='20' id='TOTAL' value='200000'> 
    <input type='text' name='DISKON' size='20' id='DISKON' onChange='hitung()' placeholder='Diskon'>  
    <input type='text' name='GRANDTOTAL' size='20' id='GTOTAL' onChange='hitung()' placeholder='Grand Total'> 

It Run Ну, но все мне нужно, это значение Text Box получить данные из MySQL

<input type='text' name='TOTAL' size='20' id='TOTAL' value='<?php echo $data[TOTAL];?>'> 

Если я бегу, что сценарий, Результат - NaN.

Может ли кто-нибудь помочь мне в решении этой проблемы.

Im очень appreciatedn ваш ответ

Благодаря

Answer 1

live demo

HTML (только удалить встроенный JS):

<input type='text' name='TOTAL' size='20' id='TOTAL' value='200000'> 
<input type='text' name='DISKON' size='20' id='DISKON' placeholder='Diskon'>  
<input type='text' name='GRANDTOTAL' size='20' id='GTOTAL' placeholder='Grand Total'> 

JS:

function el(id){return document.getElementById(id);} 
var $tot = el("TOTAL"); 
var $dis = el("DISKON"); 
var $gto = el("GTOTAL"); 

function hitung(){ 
    var tv = parseInt($tot.value, 10); 
    var dv = parseInt($dis.value, 10); 
    var besarDiskon = tv * (dv/100); 
    var grandTotal = tv - besarDiskon; 
    $dis.value = dv +'% (-'+ besarDiskon +')'; 
    $gto.value = grandTotal; 
} 

$dis.addEventListener("change", hitung, false);