Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I edit your fiddle here: <a href="http://jsfiddle.net/4L4St/5/" rel="nofollow">http://jsfiddle.net/4L4St/5/</a>, as an example; you have basic mistakes but with that example you can now try again.</p> <p>I edit your html this way:</p> <pre><code>&lt;div class="control-group clearfix"&gt; &lt;div class="rubber-nugget-calc"&gt; &lt;label class="control-label" for="item_qty"&gt; &lt;h2&gt;Calculate Bags&lt;/h2&gt; &lt;/label&gt; &lt;div class="clear"&gt;&lt;/div&gt;Length: &lt;input type="text" name="length" size="3" class="sidebarinput" /&gt;(feet) Width: &lt;input type="text" name="width" size="3" class="sidebarinput" /&gt;(feet) &lt;br/&gt;Depth: &lt;select class="depthselect" name="depth"&gt; &lt;option value=""&gt;Please Select One&lt;/option&gt; &lt;option value="1"&gt;1 inch&lt;/option&gt; &lt;option value="2"&gt;2 inches&lt;/option&gt; &lt;option value="3"&gt;3 inches&lt;/option&gt; &lt;option value="4"&gt;4 inches&lt;/option&gt; &lt;option value="5"&gt;5 inches&lt;/option&gt; &lt;option value="6"&gt;6 inches&lt;/option&gt; &lt;option value="7"&gt;7 inches&lt;/option&gt; &lt;option value="8"&gt;8 inches&lt;/option&gt; &lt;option value="9"&gt;9 inches&lt;/option&gt; &lt;/select&gt; &lt;!--Calculate Button --&gt; &lt;button class="calculate" type="button" style="float:right;" class="button"&gt;Calculate Bags Needed&lt;/button&gt; &lt;!--Results--&gt; &lt;p&gt;You will need approximately:&lt;/p&gt; &lt;div class="calc-results"&gt; &lt;div id="yards" style="display:none;"&gt; &lt;span&gt; (results) &lt;/span&gt; &lt;/div&gt; &lt;span class="mulchspan" style="display:none;"&gt; Total cubic yards of mulch &lt;/span&gt; &lt;input type="text" id = "cubicYards" name="cubicYards" size="2" class="sidebarresult" value="" /&gt; &lt;div class="clear"&gt;&lt;/div&gt; &lt;div id="pounds" style="display:none;"&gt; &lt;span style=""&gt; (results) &lt;/span&gt; &lt;/div&gt; &lt;span class="mulchspan" style="display:none;"&gt; Pounds of mulch (*For bulk delivery) &lt;/span&gt; &lt;input type="text" name="weightPounds" size="6" class="sidebarresult" /&gt; &lt;/div&gt; &lt;label class="control-label" for="item_qty"&gt;Approximate Bags Needed&lt;/label&gt; &lt;br/&gt; &lt;br/&gt; &lt;small&gt;*Note - Round up by one bag to ensure coverage / You may use the calculator or manually enter the amount.&lt;/small&gt; &lt;div class="controls"&gt; &lt;div class="button-div"&gt; &lt;input type="text" id="item_qty" name="item_qty" class="input-mini" value="" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>And your function like this:</p> <pre><code>$(".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; }); </code></pre> <p>-------------------------------UPDATE---------------------------------------</p> <p>This is the final fiddle <a href="http://jsfiddle.net/4L4St/13/" rel="nofollow">http://jsfiddle.net/4L4St/13/</a></p> <p>With fixex decimals</p> <p>Its doesnt calculate but now you can make all the calcs in the best way; with working code an example.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload