Select object with JQuery selector by data attribute with multiple value

Question

I need to select div by data, with multiple data value.

<div data-name='["ab","abcd","abcdf"]' />

$("div[data-name*='ab']")

But this solution selects all divs that contain 'ab'. I need to select only divs that contain only 'ab'.

EDIT: the best solution:

<div data-name='["ab","abcd","abcdf"]' />

$("div[data-name*='ab\"']")

ok then try $(div[data-name*='"ab"'])

Rajaprabhu Aravindasamy
– Rajaprabhu Aravindasamy

2014-05-22 10:28:30 +00:00
Commented May 22, 2014 at 10:28 — Rajaprabhu Aravindasamy
– Rajaprabhu Aravindasamy, Commented May 22, 2014 at 10:28

Alnitak · Accepted Answer · 2014-05-22 10:47:43Z

3

It's probably best to .filter the list:

$('div[data-name]').filter(function() {
   return $.inArray("ab", $(this).data('name')) >= 0
});

i.e. select any div with a data-name attribute, and then explicitly pick out those whose array value contains the desired element.

edited May 22, 2014 at 10:47

answered May 22, 2014 at 10:42

Alnitak

341k72 gold badges420 silver badges503 bronze badges

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

8 Comments

Royi Namir Over a year ago

+1. was about to paste a asolution like this :-) , just found out that $(this).data('name') ia already an array :-)

Royi Namir Over a year ago

? var a=$('div').eq(0).data('name'); alert({}.toString.apply(a)) //Array

Royi Namir Over a year ago

(all im saying is that $(this).data('name') in this case is a pure JS array)

Alnitak Over a year ago

Hmm, you're right, but for some reason .indexOf wasn't working... but does now. Weird. In any event, $.inArray is more portable.

Alnitak Over a year ago

p.s. for the data to be an array it must be in proper JSON syntax. If you use the wrong style of quotes it fails.

|

Ishan Jain · Accepted Answer · 2014-05-22 11:25:41Z

0

Try this:

HTML:

<div data-name='["ab","abcd","abcdf"]' />
<div data-name='["b","abcd","abcdf"]' />
<div data-name='["v","abcd","abcdf"]' />
<div data-name='' />
<div />

Jquery:

var  divList = [];
divList = $('div').filter(function() {
    if($(this).data('name') != "")
   return $.inArray("ab", $(this).data('name')) >= 0
});
alert(divList.length)

Working Example

edited May 22, 2014 at 11:25

answered May 22, 2014 at 10:59

Ishan Jain

8,22111 gold badges52 silver badges77 bronze badges

2 Comments

Alnitak Over a year ago

Why convert the jQuery object into a native array?

Ishan Jain Over a year ago

@Alnitak: Yes you are right, it already a array object. Thank you to update me for my silly mistake :)

Collectives™ on Stack Overflow

Select object with JQuery selector by data attribute with multiple value

2 Answers 2

8 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related