javascript - Simple mulch caculator won't fire on click and no error. jQuery and straigt js -


i'm attempting convert straight javacript function fire jquery .click

i'm not getting output errors yet wont perform calculation on jsfiddle.

var form = document.product_form_top;  function process(v) {   var value = parseint(document.getelementbyid('item_qty').value);   value += v;   document.getelementbyid('item_qty').value = value.tofixed(0); }      function calculate() {       form.cubicyards.value = (form.length.value / 3) * (form.width.value / 3) * (form.depth.value / 35);        document.getelementbyid('yards').innerhtml = finaloutput        var number = parsefloat(form.item_qty.value);       var finaloutput = number.tofixed(0);        form.item_qty.value = form.cubicyards.value * 14.7; //calculate yards        var number = parsefloat(form.cubicyards.value);       var finaloutput = number.tofixed(0);        document.getelementbyid('item_qty').innerhtml = finaloutput        form.weightpounds.value = (form.length.value / 3) * (form.width.value / 3) * (form.depth.value * 21);       form.weightpounds.value * 700;        var number = parsefloat(form.weightpounds.value);       var finaloutput = number.tofixed(0)        document.getelementbyid('pounds').innerhtml = finaloutput     }

here's jsfiddle http://jsfiddle.net/4l4st/8/

here's working version using onclick="calculate(); on button run function. rather use jquery's .click function fire it.

http://spartonenterprises.com/store/playground-mulch

also, i'm using tofixed(0) remove decimal points , appears work when inspecting firebug, visible html shows decimals. strange?

i edit fiddle here: http://jsfiddle.net/4l4st/5/, example; have basic mistakes example can try again.

i edit html way:

<div class="control-group clearfix"> <div class="rubber-nugget-calc">     <label class="control-label" for="item_qty">             <h2>calculate bags</h2>      </label>     <div class="clear"></div>length:     <input type="text" name="length" size="3" class="sidebarinput" />(feet) width:     <input type="text" name="width" size="3" class="sidebarinput" />(feet)     <br/>depth:     <select class="depthselect" name="depth">         <option value="">please select one</option>         <option value="1">1 inch</option>         <option value="2">2 inches</option>         <option value="3">3 inches</option>         <option value="4">4 inches</option>         <option value="5">5 inches</option>         <option value="6">6 inches</option>         <option value="7">7 inches</option>         <option value="8">8 inches</option>         <option value="9">9 inches</option>     </select>     <!--calculate button -->     <button class="calculate" type="button" style="float:right;" class="button">calculate bags needed</button>     <!--results-->     <p>you need approximately:</p>     <div class="calc-results">         <div id="yards" style="display:none;">  <span> (results) </span>          </div>  <span class="mulchspan" style="display:none;"> total cubic yards of mulch </span>          <input type="text" id = "cubicyards" name="cubicyards" size="2" class="sidebarresult" value="" />         <div class="clear"></div>         <div id="pounds" style="display:none;"> <span style=""> (results) </span>          </div>  <span class="mulchspan" style="display:none;"> pounds of mulch (*for bulk delivery) </span>          <input type="text" name="weightpounds" size="6" class="sidebarresult" />     </div>     <label class="control-label" for="item_qty">approximate bags needed</label>     <br/>     <br/>   <small>*note - round 1 bag ensure coverage / may use calculator or manually enter amount.</small>      <div class="controls">         <div class="button-div">             <input type="text" id="item_qty" name="item_qty" class="input-mini" value="" />         </div>     </div> </div> </div>

and function this:

$(".calculate").click(function () {  alert('sdfasgg');     document.getelementbyid('cubicyards').value = 12; document.getelementbyid('yards').style.display=""; document.getelementbyid('yards').innerhtml = 25; document.getelementbyid('item_qty').value = 26; document.getelementbyid('pounds').style.display="";     document.getelementbyid('pounds').innerhtml = 27; });

-------------------------------update---------------------------------------

this final fiddle http://jsfiddle.net/4l4st/13/

with fixex decimals

its doesnt calculate can make calcs in best way; working code example.


Comments

Post a Comment

Popular posts from this blog

monitor web browser programmatically in Android? -

i've got tricky question here. need users make payment bank (namely barclaycard) in uk. so, have https url , add parameters (such amount pay, order reference, etc) url, start http connection intent.actionview, redirect user browser can enter credit card details on bank's webpage , make payment our account successfully. far ? the code use below (i changed values privacy reasons) problem is, need app when user has completed/failed/cancelled payment. barclaycardautomatically redirects particular url when payment has succeeded, 1 if failed. there no way of knowing when barclaycard payment has succeeded go android app somehow ? button cardbutton = (button) findviewbyid(r.id.card_button); cardbutton.setonclicklistener(new view.onclicklistener() { @override public void onclick(view arg0) { string prehashstring = new string(); string prohashstring = new string(); string shapassphrase = new string(); shapassphrase = "gsvth£h70zkh...
Read more

Shrink a YouTube video to responsive width -

i have youtube video embedded on our website , when shrink screen tablet or phone sizes stops shrinking @ around 560px in width. standard youtube videos or there can add code make go smaller? you can make youtube videos responsive css. wrap iframe in div class of "videowrapper" , apply following styles: .videowrapper { float: none; clear: both; width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; } .videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } the .videowrapper div should inside responsive element. padding on .videowrapper necessary keep video collapsing. may have tweak numbers depending upon layout.
Read more

wpf - PdfWriter.GetInstance throws System.NullReferenceException -

i'm trying create pdf document using itextsharp 5.3.4 using following document document = new document(); filestream stm = new filestream(filename, filemode.create); pdfwriter writer = pdfwriter.getinstance(document, stm); i'm getting system.nullreferenceexception following stack trace: system.nullreferenceexception occurred hresult=-2147467261 message=la référence d'objet n'est pas définie à une instance d'un objet. source=itextsharp stacktrace: à itextsharp.text.version.getinstance() innerexception: i've verified neither document nor stm null, , if select "continue" in vs12 document created - exception thrown. updated itextsharp 5.4.0 , it's still occurring. can't find information on anywhere - got ideas? make sure not catching exceptions. nullreferenceexception can 1 caught , handled inside itextsharp, don't care it. fact can continue supports theory. change following setting verify: debug -> exceptions ...
Read more