AV1611 Posted May 19, 2009 Share Posted May 19, 2009 I know nothing about JS but am pretty PHP savy. I almost always can do whatever I want in PHP but in this case I need some help with a one time JS that I will use for 10 days then prolly never need again. I am making a signup form for a charity event. All I need is to make a column of things and a subtotal. I will use checkbox's for the items item 1 - $10 item 2 - $10 item 3 - $50 then at the bottom I need a input text that is updated to whatever the total of all the items with checks then they hit submit and that's it. I can handle the rest. I just have no idea how to make the value of the text input reflect the total of the items checked. Thanks for any help. Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/ Share on other sites More sharing options...
Ken2k7 Posted May 19, 2009 Share Posted May 19, 2009 Do the input field have a value attribute that states the price? Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/#findComment-837610 Share on other sites More sharing options...
Axeia Posted May 19, 2009 Share Posted May 19, 2009 <html> <head><title>x</title></head> <body> <form> <fieldset id="donations"> <legend>Donate to the</legend> <input type="checkbox" onchange="donate(this.value)" value="10" onchange name="pinguins" id="pinguins" /><label for="pinguins">$10 - Pinguins</label> <input type="checkbox" onchange="donate(this.value)" value="10" name="hamsters" id="hamsters" /><label for="hamsters">$10 - hamsters</label> <input type="checkbox" onchange="donate(this.value)" value="50" name="elephants" id="elephants" /><label for="elephants">$50 - elephants</label> <script type="text/javascript"> var dons = document.createElement( "input" ); document.getElementById( "donations" ).appendChild( dons ); function donate() { dons.value = 0; var inp = donations.getElementsByTagName( 'input' ); for( var i = 0; i<inp.length; i++ ) if( inp[i].type && inp[i].type == 'checkbox' && inp[i].checked ) dons.value = parseInt( dons.value ) + parseInt( inp[i].value ); } </script> </fieldset> </form> </body> </html> ? Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/#findComment-837646 Share on other sites More sharing options...
AV1611 Posted May 19, 2009 Author Share Posted May 19, 2009 <html> <head><title>x</title></head> <body> <form> <fieldset id="donations"> <legend>Donate to the</legend> <input type="checkbox" onchange="donate(this.value)" value="10" onchange name="pinguins" id="pinguins" /><label for="pinguins">$10 - Pinguins</label> <input type="checkbox" onchange="donate(this.value)" value="10" name="hamsters" id="hamsters" /><label for="hamsters">$10 - hamsters</label> <input type="checkbox" onchange="donate(this.value)" value="50" name="elephants" id="elephants" /><label for="elephants">$50 - elephants</label> <script type="text/javascript"> var dons = document.createElement( "input" ); document.getElementById( "donations" ).appendChild( dons ); function donate() { dons.value = 0; var inp = donations.getElementsByTagName( 'input' ); for( var i = 0; i<inp.length; i++ ) if( inp[i].type && inp[i].type == 'checkbox' && inp[i].checked ) dons.value = parseInt( dons.value ) + parseInt( inp[i].value ); } </script> </fieldset> </form> </body> </html> ? First thank you so very much. This is what I needed. Second... It doesn't work No matter what I check, the value is "0" in the box. I'm not sure what info I need to give you more? Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/#findComment-837720 Share on other sites More sharing options...
Axeia Posted May 20, 2009 Share Posted May 20, 2009 Ummm which browser are you using works fine for me in konqueror (don't have access to any other browser atm) quite sure it worked in firefox as well when I tested it yesterday. Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/#findComment-837914 Share on other sites More sharing options...
Ken2k7 Posted May 20, 2009 Share Posted May 20, 2009 <html> <head><title>x</title></head> <body> <form name="form1"> <fieldset id="donations"> <legend>Donate to the</legend> Penguins: <input type="checkbox" onclick="donate()" value="10" onchange name="pinguins" id="pinguins" /><label for="pinguins">$10 - Pinguins</label><br /> Hamsters: <input type="checkbox" onclick="donate()" value="10" name="hamsters" id="hamsters" /><label for="hamsters">$10 - hamsters</label><br /> Elephants: <input type="checkbox" onclick="donate()" value="50" name="elephants" id="elephants" /><label for="elephants">$50 - elephants</label><br /> Total: <input type="text" name="total" id="total" readonly="readonly" /> <script type="text/javascript"> function donate() { var total = 0; var inp = document.forms.form1.getElementsByTagName( 'input' ); for( var i = inp.length; --i > -1; ) if(inp[i].type === 'checkbox' && inp[i].checked) total += inp[i].value; document.forms.form1.total.value = total; } </script> </fieldset> </form> </body> </html> Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/#findComment-838106 Share on other sites More sharing options...
Axeia Posted May 20, 2009 Share Posted May 20, 2009 Will need some parseInt() at the very least or it will just do something like 101050 Link to comment https://forums.phpfreaks.com/topic/158813-need-simple-one-time-js-for-form/#findComment-838137 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.