trouble adding multiple values to array

Question

In this fiddle when you select a value it populates all input fields. I am trying to use this same principle in this fiddle but it is not working. I am not quite sure why?

I am not getting any errors but I feel as though the below code is in the wrong spot and is being ignored?

    jQuery('#newtable select').on('change', function() {
        var div_id = 'div_'+jQuery(this).attr('id');
        var select_val = jQuery(this).find('option:selected').data('value');
        console.log();
        if( select_val != '' ) {
            var a = select_val.split(',');
            var count = 0;
            jQuery('tr#'+div_id+' .flag').each(function() {
            jQuery(this).val(a[count]);
            ++count;
            });
        } else {
            jQuery('tr#'+div_id+' input.input_text').val('');
        }
    });

What I am trying to acheive in the second fiddle is for when you select 'Ryan $100' it updates the below code.

    <table id="newtable">
    <tr id='div_m2'>
            <input type="hidden" class='input_text flag' value="0" name="id[]">
            <input type="hidden" class='input_text flag' value="0" name="name[]">
            <input type="hidden" class='input_text flag' value="0" name="sales[]">
            <input type="hidden" class='input_text flag' value="0" name="price[]">
            <td colspan="3">
                <select id='m2'>
    <option value="" data-value="">Choose Salesman</option>
    <option value="0" data-value="id_03,Ryan,1,100">Ryan $100</option>
    <option value="0" data-value="id_01,Tom,1,100">tom $100</option>
                </select>
            </td>
        </tr>
    </table>

to this

        <input type="hidden" class='input_text flag' value="id_03" name="id[]">
        <input type="hidden" class='input_text flag' value="Ryan" name="name[]">
        <input type="hidden" class='input_text flag' value="1" name="sales[]">
        <input type="hidden" class='input_text flag' value="100" name="price[]">

and when you do this showValues() is also run so that the above data is included in the table I am generating.

So my desired output for the table if you choose ryan $100 is.

    <table id="results">
        <tbody>
        <tr><th>Rank</th><th>Salesman</th><th>Products Sold</th><th>Total Sale Price</th><th>Commission (30% of Total Sale Price + 5 for each sale)</th></tr>
        <tr data-id="id_03"><td>1</td><td>ryan</td><td>2</td><td>110</td><td>550.00</td></tr>
        <tr data-id="id_02"><td>2</td><td>Jerry</td><td>3</td><td>60</td><td>300.00</td></tr>
        <tr data-id="id_01"><td>3</td><td>Tom</td><td>5</td><td>50</td><td>250.00</td></tr>
        </tbody>
    </table>

You are linking 2 fiddles which are complitely different in design but you say you want the same functionality. Can you elaborate what exactly you expect to happen in your fiddle? — Nope
– Nope, Commented Aug 6, 2012 at 11:27
@AnthonyGrist I have added more detail in, let me know if more details are still required. — ak85
– ak85, Commented Aug 6, 2012 at 11:41
@FrançoisWahl I have added more detail in, let me know if more details are still required. — ak85
– ak85, Commented Aug 6, 2012 at 11:41
your var select_val = jQuery(this).find('option:selected').data('value'); doesn't work as you expect, you need var select_val = jQuery(this).find('option:selected').attr('data-value'); — Chris
– Chris, Commented Aug 6, 2012 at 11:49

Chris · Accepted Answer · 2012-08-06 12:17:08Z

2

This should solve your problem:

http://jsfiddle.net/VNSam/19/

If you want to update your table on select you should call showValue() :-)

edited Aug 6, 2012 at 12:17

answered Aug 6, 2012 at 12:05

Chris

1,1222 gold badges19 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ak85 Over a year ago

thanks I was just replying to your last comment saying to put it in as answer so I could accept! Just in relation to the showValues(); on the 5th last line, is it ok to include the function in its own function? Obviusly it works I was just wondering if it is reccomeneded?

Chris Over a year ago

sry I didn't notice that it was all one big function. Try adding $('#m2').change(showValues); in the end instead of calling showValues() within itself

Collectives™ on Stack Overflow

trouble adding multiple values to array

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related