i am in mobile app and i want to fill up an array with values from checkboxes.
my code is
if (row.flatdescription == flatdescription) {
if (row.receiptno == 0){
items.push('<input type="checkbox" name="code_'+ i +'" id="code_'+ i +'" value="' + row.amount + '" previous="' + row.pastpayments + '" barcode="' + row.barcode + '" todayp="' + row.todaypayments + '"/><label for="code_'+ i +'">' + row.period +'..........'+ row.amount+'</label></br>');
}
allbarcode[i] = row.barcode;
previouspayments1 = previouspayments1 + row.pastpayments;
previouspayments = previouspayments1.toFixed(2);
sofeilon1 = sofeilon1 + row.amount;
sofeilon = sofeilon1.toFixed(2);
total1 = total1 + row.amount - row.pastpayments;
total = total1.toFixed(2);
}
and my array code
function barcodeTotal() {
barcode = [];
barcodeamount = [];
barcodeprevious = [];
$("input:checked").each(function(i) {
barcode[i] = $(this).attr("barcode");
barcodeamount[i] = $(this).attr("value");
barcodeprevious[i] = $(this).attr("previous");
});
}
my goal is to fill barcode array like this
barcode [barcode: barcode, amount: value, previous: previous, ....
i will appreciate your answers
3 Answers 3
You can transform your checked input fields into an array easily:
var checkedInputs = $("input:checked") // this contains the raw HTML-Elements
Now, depending on the desired result you may either harvest the values separately
var barcodes = checkedInputs.map(function() { return $(this).attr('barcode') })
var amounts = checkedInputs.map(function() { return $(this).attr('amount') })
var previouss = checkedInputs.map(function() { return $(this).attr('previous') })
or, what might be even better, as objects just like twilson suggested
var results = checkedInputs.map(function() {
return {
barcode: $(this).attr('barcode'),
amount: $(this).attr('amount'),
previous: $(this).attr('previous')
}
})
In this case you want the this to be taken from inside of the function call,
as it refers to the object, you matched with the $('input:checked') call.
If you store var self = this as twilson suggested, you would not receive the actual values of the input box, but no values, as the this of the calling context is most likely not an HTMLElement at all.
Comments
You would be best served with an array of objects, rather than just an array.
var self = this; // Important because 'this' may change in scope.
var barcodes = []
$("input:checked").each(function(index, item) {
barcodes.push({
barcode: $(self).attr("barcode"),
amount: $(self).attr("value"),
previous: $(self).attr("previous")
});
});
You will then end up with an array something like this:
[
{ barcode: "5049383", amount: "4", previous: "17263742" },
{ barcode: "5049389", amount: "1", previous: "1726376" }
]
- Put the
varkeyword before your variables inside the function otherwise they will are global. var self = this;is generally good practice when calling additional functions because the scope ofthiscan change quite a bit depending upon your point of execution, usually to become the main jQuery object.selfgive you that pointer back to what you expect to be talking to.
1 Comment
This will help you
var arrBarCodeDet = new Array();
var objCheckedElem = $("input:checked");
$.map(objCheckedElem,function(elem,index){
/**
Result As Object
arrBarCodeDet[index] = [{'barcode':$(elem).attr("barcode")},{'barcodevalue':$(elem).attr("barcodevalue")}];
*/
//Result As Arrray
arrBarCodeDet[index] = new Array();
arrBarCodeDet[index]['barcode'] = $(elem).attr("barcode");
arrBarCodeDet[index]['barcodevalue'] = $(elem).attr("barcodevalue");
})
});
<input type="checkbox" name="check1" value="1" checked="checked" barcode="12233" barcodevalue="12" />Check Box 1 <br />
<input type="checkbox" name="check2" value="1" checked="checked" barcode="45451" barcodevalue="24" />Check Box 2 <br />
<input type="checkbox" name="check3" value="1" checked="checked" barcode="34343" barcodevalue="36" />Check Box 3 <br />
<input type="checkbox" name="check4" value="1" barcode="32333" value="48" />Check Box <br />
Result Will be arrBarCodeDet [ Array[0] barcode: "12233" barcodevalue: "12" length: 0 proto: Array[0] , Array[0] barcode: "45451" barcodevalue: "24" length: 0 proto: Array[0] , Array[0] barcode: "34343" barcodevalue: "36" length: 0 proto: Array[0] ]