Jump to content

i cannot get the total to display


HensterRSA
 Share

Recommended Posts

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    <html>    <head> <body><script>    function alertTotal() {	    var aSelect = document.getElementById('a');	    var bSelect = document.getElementById('b');	    var cSelect = document.getElementById('c');	    var aValue = aSelect.options[aSelect.selectedIndex].value;	    var bValue = bSelect.options[bSelect.selectedIndex].value;	    var cValue = cSelect.options[cSelect.selectedIndex].value;	    	    alert(parseInt(aValue) + parseInt(bValue) + parseInt(cValue));    }</script>CPU #######:<select id="a"><option value="0">Not selected</option>    <option value="3500">I7 R3500.00</option>    <option value="2500">I5 R2500.00</option>    <option value="1500">I3 R1500</option>    </select><br>Mother Board :<select id="b" width="230" STYLE="width: 430px" size="0"><option value="0">Not selected</option>    <option value="363">Intel Houlton D2500 Mini-ITX - Supports 2 x DDR3 (Max 4GB). Up to 8 USB 2.0 Ports, 2 x SATA, 1 x Parallel Port, 2 x Serial Ports (via Header) 1 x D-Sub, 1 x Conventional PCI Slot,  10/100/1000 LAN</option>    <option value="2">2</option>    <option value="3">3</option>    </select><br>RAM:#######<select id="c"><option value="0">Not selected</option>    <option value="100">2GB DDR3 1333, 240-Pin Memory Module - PATRIOT</option>    <option value="190">4GB DDR3 1333, 240-Pin Memory Module - PATRIOT</option>    <option value="250">4GB DDR3 1333, 240-Pin Memory Module - Kingston </option>    </select><br><br><br><br><button onclick="alertTotal();">Show Total</button>    </body> 

When i click the total works fine but when i add the scritp to show the total i get nothing , i don't want to click to see the total

  • Price: R<span id="alertTotal();"></span>

Link to comment
Share on other sites

??? you are using calling of function for id ref. normally set span to

Price: R<span id="currentTotal">0</span>

in the calculating function

<script>    function alertTotal() {            var aSelect = document.getElementById('a');            var bSelect = document.getElementById('b');            var cSelect = document.getElementById('c');            var currentTotal = document.getElementById('currentTotal'); /* added by dsonesuk */            var aValue = aSelect.options[aSelect.selectedIndex].value;            var bValue = bSelect.options[bSelect.selectedIndex].value;            var cValue = cSelect.options[cSelect.selectedIndex].value;                        alert(parseInt(aValue) + parseInt(bValue) + parseInt(cValue));currentTotal.innerHTML=parseInt(aValue) + parseInt(bValue) + parseInt(cValue; /* added by dsonesuk */    }</script>

if you wish current total to update whenever a option is selected add onchange="alertTotal()" to each select element id a, b and c.

Link to comment
Share on other sites

found it thanks

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    <html>    <head> <body><script>    function alertTotal() {		    var aSelect = document.getElementById('a');		    var bSelect = document.getElementById('b');		    var cSelect = document.getElementById('c');		    var aValue = aSelect.options[aSelect.selectedIndex].value;		    var bValue = bSelect.options[bSelect.selectedIndex].value;		    var cValue = cSelect.options[cSelect.selectedIndex].value;		    		    //alert(parseInt(aValue) + parseInt(bValue) + parseInt(cValue));		    total.innerHTML=parseInt(aValue) + parseInt(bValue) + parseInt(cValue);    }</script>CPU #######:<select id="a" onchange="alertTotal();"><option value="0">Not selected</option>    <option value="3500">I7 R3500.00</option>    <option value="2500">I5 R2500.00</option>    <option value="1500">I3 R1500</option>    </select><br>Mother Board :<select id="b" width="230" STYLE="width: 430px" size="0" onchange="alertTotal();"><option value="0">Not selected</option>    <option value="363">Intel Houlton D2500 Mini-ITX - Supports 2 x DDR3 (Max 4GB). Up to 8 USB 2.0 Ports, 2 x SATA, 1 x Parallel Port, 2 x Serial Ports (via Header) 1 x D-Sub, 1 x Conventional PCI Slot,  10/100/1000 LAN</option>    <option value="2">2</option>    <option value="3">3</option>    </select><br>RAM:#######<select id="c" onchange="alertTotal();">    <option value="0">Not selected</option>    <option value="100">2GB DDR3 1333, 240-Pin Memory Module - PATRIOT</option>    <option value="190">4GB DDR3 1333, 240-Pin Memory Module - PATRIOT</option>    <option value="250">4GB DDR3 1333, 240-Pin Memory Module - Kingston </option>    </select><br><br><br><br><div>Total: R<span id="total">0</span></div><!-- <button onclick="alertTotal();">Show Total</button> --></body>

Link to comment
Share on other sites

you have told that aSelect refers to element with id="a"you have told that bSelect refers to element with id="b"you have told that cSelect refers to element with id="c" but you have not told it what total refers to look at my example with /* added by dsonesuk*/

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...