Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I'd suggest, to handle the summation, changing the jQuery to:</p> <pre><code>$('#butt').click(function () { /* this gets an array of the numbers contained within visible input elements */ var nums = $('.list input:visible').map(function () { return parseInt(this.value, 10); }), // initialises the total variable: total = 0; /* iterates over the numbers contained within the array, adding them to the 'total' */ for (var i = 0, len = nums.length; i &lt; len; i++) { total += nums[i]; } var msg = ''; if (isNaN(total)) { msg = 'Input three numbers, please...'; } else if (total &lt; 30) { msg = "That's bad, should be higher..."; } else if (total &gt; 40) { msg = "That's bad, should be lower..."; } else { msg = "You got it... Nice work."; } $('#output').text(msg); }); </code></pre> <p>And also not using the <code>id</code> attribute to select the elements to sum, instead using <code>class</code>-names:</p> <pre><code>&lt;div class="list owner"&gt; &lt;p&gt;a&lt;/p&gt; &lt;input class="numbers" type="text" size="2" /&gt; &lt;br/&gt; &lt;p&gt;b&lt;/p&gt; &lt;input class="numbers" type="text" size="2" /&gt; &lt;br/&gt; &lt;p&gt;c&lt;/p&gt; &lt;input class="numbers" type="text" size="2" /&gt; &lt;br/&gt; &lt;!-- questions for owners --&gt; &lt;/div&gt; &lt;div class="list not-owner"&gt; &lt;p&gt;x&lt;/p&gt; &lt;input class="numbers" type="text" size="2" /&gt; &lt;br/&gt; &lt;p&gt;y&lt;/p&gt; &lt;input class="numbers" type="text" size="2" /&gt; &lt;br/&gt; &lt;p&gt;z&lt;/p&gt; &lt;input class="numbers" type="text" size="2" /&gt; &lt;br/&gt; &lt;!-- questions for non-owners --&gt; &lt;/div&gt; </code></pre> <p><a href="http://jsfiddle.net/davidThomas/CcVsz/20/" rel="nofollow">JS Fiddle demo</a>.</p> <p>To test if someone is, or says they are, the owner:</p> <pre><code>var total = 0, isOwner = $.trim($('.myOptions option:selected').val()) === 'owner'; if (isOwner) { console.log("It's the owner"); } </code></pre> <p>The above jQuery is coupled to a <code>select</code> element in which the <code>option</code> elements have values:</p> <pre><code>&lt;select class="myOptions"&gt; &lt;option value="-1" data-val="" selected&gt;Pick an option&lt;/option&gt; &lt;option value="owner" data-val="owner"&gt;Owner&lt;/option&gt; &lt;option value="not-owner" data-val="not-owner"&gt;Not Owner&lt;/option&gt; &lt;/select&gt; </code></pre> <p><a href="http://jsfiddle.net/davidThomas/CcVsz/21/" rel="nofollow">JS Fiddle demo</a>.</p> <p>References:</p> <ul> <li><a href="http://api.jquery.com/jQuery.trim/" rel="nofollow"><code>jQuery.trim()</code></a>.</li> <li><a href="http://api.jquery.com/map/" rel="nofollow"><code>map()</code></a>.</li> <li><a href="http://api.jquery.com/selected-selector/" rel="nofollow"><code>:selected</code> selector</a>.</li> <li><a href="http://api.jquery.com/visible-selector/" rel="nofollow"><code>:visible</code> selector</a>.</li> </ul>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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