unable to change the text field value and how to use tofixed method?

[jaiffable]

I can’t change the value of the text field

   <p>
            <label for="name">Quantity</label>
            <input type="text" name="shrqty" id="shrqty" onkeyup="calculate()" value="0" required />
        </p>
        
        <p>
                <label for="name">Purchase Price</label>
                <input type="text" name="shrprc" id="shrprc" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">Purchase Amount</label>
                <input type="text" name="totamt" id="totamt" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">Sale Price</label>
                <input type="text" name="saleprc" id="saleprc" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">Sale Date</label>
                <input type="text" size="12" id="popup_container2" name="saledate" readonly="readonly" required />
            </p> 
        
            <p>
                <label for="name">Sale Amount</label>
                <input type="text" name="saleamt" id="saleamt" onkeyup="calculate()" value="0" required />
            </p>    
            
            <p>
                <label for="name">Profit</label>
                <input type="text" name="profit" id="profit" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">Brokerage </label>
                <input type="text" name="sharebrkrg" id="sharebrkrg" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">STT </label>
                <input type="text" name="shrstt" id="shrstt" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">STMP </label>
                <input type="text" name="shrstmp" id="shrstmp" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">To Charge </label>
                <input type="text" name="shrtochrg" id="shrtochrg" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">SEBI </label>
                <input type="text" name="shrsebi" id="shrsebi" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">SGST </label>
                <input type="text" name="shrsgst" id="shrsgst" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">CGST </label>
                <input type="text" name="shrcgst" id="shrcgst" onkeyup="calculate()" value="0" required />
            </p>
        
            <p>
                <label for="name">Total Charges</label>
                <input type="text" name="shrtotchrg" id="shrtotchrg" onkeyup="calculate()" value="0" required />
            </p>
    
        <script type="text/javascript">
        calculate = function()
        {
            var aa = document.getElementById('shrqty').value;
            var bb = document.getElementById('shrprc').value;
            var cc = document.getElementById('saleprc').value;
        
             
            document.getElementById('totamt').value = parseInt(aa)*parseInt(bb);
            document.getElementById('saleamt').value = parseInt(aa)*parseInt(cc);
            document.getElementById('profit').value = document.getElementById('saleamt').value - document.getElementById('totamt').value;
            document.getElementById('sharebrkrg').value = document.getElementById('totamt').value * 0.020 / 100;
            document.getElementById('shrstt').value = document.getElementById('saleamt').value * 0.010 / 100;
            document.getElementById('shrstmp').value = document.getElementById('totamt').value * 0.002 / 100;
            document.getElementById('shrsebi').value = document.getElementById('totamt').value * 0.002 / 100;
            document.getElementById('shrtochrg').value = document.getElementById('totamt').value * 0.002 / 100;
            document.getElementById('shrsgst').value = document.getElementById('sharebrkrg').value +  document.getElementById('shrtochrg').value * 9 / 100;
            document.getElementById('shrcgst').value = document.getElementById('sharebrkrg').value +  document.getElementById('shrtochrg').value * 9 / 100;
            
            document.getElementById('shrtotchrg').value = +document.getElementById('sharebrkrg').value + +document.getElementById('shrstt').value + +document.getElementById('shrstmp').value + +document.getElementById('shrsebi').value + +document.getElementById('shrtochrg').value + +document.getElementById('shrsgst').value + +document.getElementById('shrcgst').value;
            
             
        }
        
        </script>

1. When I use onchange instead of onkeyup I was able to change the text value but then the calculation function doesn’t work.
2. How can I use tofixed method I have tried this

document.getElementById('shrsgst').value = (document.getElementById('sharebrkrg').value + document.getElementById('shrtochrg').value * <?php echo $sgst; ?> / 100).toFixed(3);

but it’s not working.

I know it’s a bad coding example because I am learning javascript if anybody has better code for multiple text field calculations it will be very helpful for me.

[Sylvant]

I strongly advise you to store your dom elements in variables, so you dont have to target them every time, plus, it will shorten your code. For example var profit=document.getElementById('profit'). Then you can simply refer it by “profit”.
One reason why toFixed might not work is, its a number method, while element.value returns a string. You might need to change your “values” into numbers, before you proceed with math calculations.