javascript - Create Unique Hidden Field IDS from Select Menu options -

i have modal displays stock information specific item has multiple locations within warehouse. user selects locations , quantities each menu , clicks confirm, information modal needs imported on pick list printed out.

to planning use arrays transport data pick list.

i have hidden field each row, containing values of location , qty picked there.

location 1 + qty 1 = hidden field 1

location 2 + qty 2 = hidden field 2

i want able put hidden fields array once button clicked.

hidden field 1 + hidden field 2 = array.

i can create hidden fields fine, when go make final array contains data, seems want add newest hidden field created it.

dialog - pick quantity button (used confirm selections):

//pick quantity button 'pick quantity': function() {  jquery('.ui-dialog button:nth-child(1)').button('disable');       //disables current selection, cannot editted $('#addlocqtypick'+picker).prop ('disabled', true);   //disables current selection, cannot editted $('#locationpickerselect'+ picker).prop ('disabled', true);    //adds unique number id of input fields picker++;   //for loop helps total quanities being selected in each picker total=0; (i = 0; i<picker; i++) { total= total + $('#addlocqtypick'+i).val() * 1.0; }  //variable decides max value of pick on appends using previous selection qtyreqtot= qtyreq - total;    //"pick location" button enabled whilst qty req has not been met if (total !== qtyreq){     jquery('.ui-dialog button:nth-child(2)').button('enable'); }  //"pick quantity", "pick location" disabled, whilst "confirm" button enabled when total reaches qty req if (total == qtyreq){     jquery('.ui-dialog button:nth-child(2)').button('disable');     jquery('.ui-dialog button:nth-child(1)').button('disable');     jquery('.ui-dialog button:nth-child(3)').button('enable'); }  //pick location button disabled if no more locations pick if (length == 1){      jquery('.ui-dialog button:nth-child(2)').button('disable'); }  if (total !== qtyreq && length == 1){     jquery('.ui-dialog button:nth-child(1)').button('disable');     $(":button:contains('cancel')").focus(); }    //create hidden field - location  //for loop creates fields  (i = 0; i<picker; i++){ hiddenselection = [$('#locationpickerselect'+i).val(),$('#addlocqtypick'+i).val()]; var appendhiddenselection = '<input type="hidden" class="hiddenselection'+ +'" value='+hiddenselection+'>'; $('#addlocationpicker').append(appendhiddenselection);   alert(appendhiddenselection +'this selectionfield'+i);  } }, 

confirm button - used generate final array containing previous arrays:

'confirm': function() {       //reset length loop length = undefined;  //remove "multiple location" icon row. $('#icon'+id).hide();  //checks "multiple location" icon existence , adds pick list button when hidden. $('img[id^=icon]:visible').length || $('#processpicklist').show();  //change text colour blue have visual confirmation item ready picking $('#desc'+id).css('color', '#0000ff'); $('#qtyreq'+id).css('color', '#0000ff'); $('#qtyinstock'+id).css('color', '#0000ff');  //create total array  totalhiddenarray = [hiddenselection]  alert (totalhiddenarray);   $(this).dialog('close');  }, 

i think need able create unique ids input fields , show how them added array.

you can try replacing

hiddenarray = [appendhiddenqty, appendhiddenlocation] 

by

hiddenarray[hiddenarray.length] = [appendhiddenqty, appendhiddenlocation] 

this way, instead of overwriting hiddenarray within loop, add [appendhiddenqty, appendhiddenlocation] @ end of hiddenarray.

---

edit1:

replace

hiddenselection = [$('#locationpickerselect'+i).val(),$('#addlocqtypick'+i).val()]; 

by

hiddenselection[hiddenselection.length] = [$('#locationpickerselect'+i).val(),$('#addlocqtypick'+i).val()]; 

or, can use push :

hiddenselection.push([$('#locationpickerselect'+i).val(),$('#addlocqtypick'+i).val()]); 

please see quickly made fiddle

---

edit2:

ok, let's try replace whole loop by:

var hiddenselection = new array; (i = 0; i<picker; i++){     hiddenselection = [$('#locationpickerselect'+i).val(),$('#addlocqtypick'+i).val()];     var appendhiddenselection = '<input type="hidden" class="hiddenselection'+ +'"     value='+hiddenselection+'>';     $('#addlocationpicker').append(appendhiddenselection);       alert(appendhiddenselection +'this selectionfield'+i);      totalhiddenarray.push([hiddenselection]); } 

you have remove confirm function :

//create total array totalhiddenarray = [hiddenselection] 

you have delcare totalhiddenarray new array outside function (at top of js code exemple, because guess trying access totalhiddenarray function loop) :

var totalhiddenarray= new array; 

another fiddle