CODEWITHSUNDEEP
javascriptjquerydrop-down-menu
suo
suo

Reputation: 609

Posting dynamically appended dropdown data

I have a dropddown on my homepage which on select, appends extra dropdowns based on the value selected, as shown in this fiddle:

https://jsfiddle.net/harunthuo/he55vwca/3/

The challenge i'm facing is: the dropdowns will be appended dynamically based on the value selected in the 'Children' dropdown. So i'm wondering how i will capture the value(s) of each of the appended dropdowns and capture it in my post. The appended dropdown(s) all have same name and class attribute so if I were to grab the selection of the appended dropdown(s):

$('#children-number').on('change', '.children-num', function(e){
    var child_num = e.target.value;
    console.log(child_num);
});

This will capture the values selected in each appended dropdown. How do I proceed from here so that i capture these values and send them all to my post so that I capture the value(s) as such:

$('#children-number').on('change', '.children-num', function(e){
        var child_num = e.target.value;
        console.log(child_num);

        var data = $('#myForm').serializeArray();
        data.push({name: 'ages', value: child_num});

        $.post("page.php", data);
});

This last part is where i'm a bit stuck. Thanks

Upvotes: 1

Views: 35

Answers (1)

rebecca
rebecca

Reputation: 963

ok, maybe this can help you move along:

try this (but maybe outside the change function, maybe a button-click): 

 var dataArr = [];  
 $('.children-num').each(function() {
    value = $(this).val();
    dataArr.push(value);
 });

and then instead of 

data.push({name: 'ages', value: child_num});

do

data.push({name: 'ages', value: dataArr});

now you should get 

["ages"]=> array()

or something similar

here's a fiddle which logs the values of the child-nums in the console after you clicked the "click-me" button

Edit: I'd also recommend not doing the $.post inside the change event but rather on a button click or similar too, since it would post every time the selection is changed, i don't think that's a good practice

Upvotes: 1

Related Questions