How to get checked checkbox and associated text box value in an array and append this value to url using jquery or javascript

Question

In my scenario there is a list of items, check box and quantity field text box is assigned to each item. What i want to achieve is to get all checked check box and associated quantity field text box value in an array and append it to url.

Need to pass these values in below mentioned url

shopping.sandbox.netsuite.com/app/site/backend/additemtocart.nl?c=4030365&n=1&buyid=multi&multi=checkboxvalue,quantityvalue;checkboxvalue,quantityvalue; etc

This is my html code

<a href="" onclick="javascript:addURL(this);alert(this.href);" id="ct1">Add to cart</a> 
<div class="cell-checkbox">
<input type="checkbox" name="select" value="    
<%=getCurrentAttribute('item','internalid')%>" class="big">
</div>
<div class="cell-cart">
<input name="qty" id="qty" value="1" class="input">
</div>

using <%=getCurrentAttribute('item','internalid')%> i'm getting checkbox value. on clicking add to cart anchor tag below mentioned script is executing.

What i have tried so far

<script>
function addURL(element)
{     
var qtyvalue = document.getElementById("qty").value;
var val = [];  
$(':checkbox:checked').each(function(i)
{          
val[i] = $(this).val();
$('#ct1').attr('href','http://shopping.sandbox.netsuite.com/app/site/backend/additemtocart.nl?c=4030365&n=1&buyid=multi&multi='+val[i]+','+qtyvalue);
});
}
</script>

But its adding only single check box and quantity field value to url not entire array.I want to add these values in format something like this

checkboxvalue,quantityvalue;checkboxvalue,quantityvalue;etc

I am new to java script and jquery so need help to figure this out.

Milind Anantwar · Accepted Answer · 2016-03-18 06:54:41Z

1

You can iterate over checked checkboxes and create new array that have checked value + comma separator + current qtyvalue

and then join them with ; character:

var result = [];
$(':checkbox:checked').each(function(i){
 result.push($(this).val() + "," + $(this).parent().next().find('input').val());
});
var strreuslt = result.join(';'); // checkboxvalue,quantityvalue;checkboxvalue,quantityvalue;etc
$('#ct1').attr('href','http://shopping.sandbox.netsuite.com/app/site/backend/additemtocart.nl?c=4030365&n=1&buyid=multi&multi='+strreuslt);

answered Mar 18, 2016 at 6:54

Milind Anantwar

82.3k26 gold badges97 silver badges128 bronze badges

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

3 Comments

user2787474 Over a year ago

Thanks for response but i am getting undefined quantity value.

Milind Anantwar Over a year ago

@user2787474: can you share the problem fiddle

Milind Anantwar Over a year ago

@user2787474: you have not used my code there, give it a try.

Satish Kumar sonker · Accepted Answer · 2016-03-18 06:52:54Z

1

You are adding the href attr in each loop that's why its appending the final value of val array in href attr

Try below one

<script>
function addURL(element)
{     
var qtyvalue = document.getElementById("qty").value;
var val = [];  
$(':checkbox:checked').each(function(i)
{          
val[i] = $(this).val();

});
$('#ct1').attr('href','http://shopping.sandbox.netsuite.com/app/site/backend/additemtocart.nl?c=4030365&n=1&buyid=multi&multi='+val.toString()+','+qtyvalue);
}
</script>

answered Mar 18, 2016 at 6:52

Satish Kumar sonker

1,3089 silver badges16 bronze badges

Comments

Prasad Guduri · Accepted Answer · 2016-03-18 08:04:45Z

0

Generate a string with selected values and append after the loop. Like Below

 function addURL(element)
{     

var selectionString = '';  
$(':checkbox:checked').each(function(i)
{         

selectionString = selectionString + $(this).val()+','+$('.input').eq(i+1).text();

});
$('#ct1').attr('href','http://shopping.sandbox.netsuite.com/app/site/backend/additemtocart.nl?c=4030365&n=1&buyid=multi&multi=selectionString);
}

edited Mar 18, 2016 at 8:04

answered Mar 18, 2016 at 6:58

Prasad Guduri

1251 silver badge10 bronze badges

5 Comments

user2787474 Over a year ago

Thanks for response but its adding only single check box and quantity field value not all selected values

Prasad Guduri Over a year ago

Updated. Now it will select all checked check box values and Quantity.

user2787474 Over a year ago

Thanks but its not updating current selected check-box's associated input box value.its not updating input box value

Prasad Guduri Over a year ago

So How the quantity textboxes are rendered ? share some sample html.

Prasad Guduri Over a year ago

above solution will work only if all quantity textboxes are rendered with class "input".

Collectives™ on Stack Overflow

How to get checked checkbox and associated text box value in an array and append this value to url using jquery or javascript

3 Answers 3

3 Comments

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related