I have a web page with a (generated) list of checkboxes, each representing a database record
<input type="checkbox" data-oid="<%= record.OID %>" />
After checking the desired check boxes, the concatenated values of the data- attribute should be posted to the server.
Since this selector
$("input[type='checkbox']:checked")
would return all the checked checkboxes, I expected the expression
$("input[type='checkbox']:checked").data("oid")
to return all data- values as an array. But NO:
Store arbitrary data associated with the matched elements or return the value at the named data store for the first element in the set of matched elements.
says the jQuery documentation quite unexpectedly.
I need a map(), I thought, and after a couple of tries convinced the JS interpreter to let me have my map():
$("input[type='checkbox']:checked") .map(function(i,el) { return $(this).data("oid"); })
Great. This returns something that looks like an integer array, e.g.
[82, 86]
but it is not, since I cannot join() it:
TypeError: Object [object Object] has no method ‘join’
and the Chrome Developer Tool claims it looks more like a stack than an array. Make it so!
$("input[type='checkbox']:checked") .map(function() { return $(this).data("oid"); }) .toArray()
The result not only looks like an array, it really seems to be an array, and
$("input[type='checkbox']:checked") .map(function() { return $(this).data("oid"); }) .toArray() .join(",")
finally returns a string of concatenated integer values:
"82,86"