Jquery - How do I find nonEmpty field from several selectors, send value to another field
<p>Help please, I am not quite sure how to approach this one:
I have an app where the client has several sections which contain several fields.  Sometimes the same field appears.  For example, "<strong>quantity</strong>" or "<strong>color</strong>" may appear in three, four or more sections.  </p>

<p>When the web form is submitted, the value sent to the other end is empty because the next qty field, which is empty, will overwrite the value, thus producing an empty/null value on the other end. [there is only one quantity field on the other end]</p>

<p>Because of the structure of this app, which they want to maintain,  I want a clear cut way of saying/do the following using jquery:</p>

<p>get fields #quantityOne,#quantityTwo,#quantityThree, determine which one has a value in it, take that value and place it in hidden field finalQty.</p>

<p>Could someone show me how to accomplish this please?</p>

<p><strong>Adding one note for clarification:</strong></p>

<blockquote>
  <p>The user would only be filling out ONE of the sections, thus only one
  of the qty fields. So if I put 555 in qtyField #1, then 555 should be
  copied to finalQty, if I put 35 in qtyField #2, then 35 should be
  copied to finalQty</p>
</blockquote>

<p><a href="http://jsfiddle.net/justmelat/4ruh2/" rel="nofollow">My code</a></p>

<p><strong>html/jquery:</strong>
</p>

<pre><code>&lt;fieldset id="sectionOne" name="sectionOne"&gt;
&lt;legend class='legendHdrs' &gt;Section One&lt;/legend&gt;
Name: &lt;input type="text" name="nameOne" id="nameOne" class="name" /&gt;&lt;br /&gt;
Quantity: &lt;input type="text" name="quantityOne" id="quantityOne" class="quantity"/&gt;
    &lt;/fieldset&gt;&lt;br /&gt;&lt;br /&gt;

&lt;fieldset id="sectionTwo"&gt;
&lt;legend&gt;Section Two&lt;/legend&gt;
Name: &lt;input type="text" name="nameTwo" id="nameTwo" class="name" /&gt;&lt;br /&gt;
Quantity: &lt;input type="text" name="quantityTwo" id="quantityTwo" class="quantity"/&gt;
&lt;/fieldset&gt;&lt;br /&gt;&lt;br /&gt;

&lt;fieldset  id="sectionThree"&gt;
&lt;legend&gt;Section Three&lt;/legend&gt;
Name: &lt;input type="text" name="nameThree" id="nameThree" class="name" /&gt;&lt;br /&gt;
Quantity: &lt;input type="text" name="quantityThree" id="quantityThree" class="quantity"/&gt;
&lt;/fieldset&gt;
&lt;hr&gt;

Final Qty: &lt;input type="text" name="finalQty" id="finalQty" class="finalQty"/&gt;
 &lt;input type="button" value="Add Qty" id="addQty"&gt;
&lt;/form&gt;​

    $(document).ready(function() 
{
    $('#addQty').on('click', function()
            {
            var holdval;
        $('#quantityOne,#quantityTwo,#quantityThree').each(function() 
                    {
                        if($(this).val() !== '')
                            {
                                holdval = $(this).val() 
                            }
                    });
        $('#finalQty').val(holdval);
            });

 });
</code></pre>
