Attribute in dom but not usable in a jQuery selector

Question

I face a very weird situation here. For the context I'm using a modified version of this svg-edit fork and I needed to add custom html attributes (data-propzone="true"). But the weird thing is when I load my svg with the svg-edit "setSvgString" function, I can't use my attribute as a selector, you can see in the screenshot that I can use the element ID or even the fill value and it's working fine, it retrieve my element with my custom attribute but with $('[data-propzone="true"]') the result is empty...

My element with my custom attribute is in the dom as you can see:

I really don't know what could be wrong here, I always use data-attributes selectors and never had an issue.

I'm sorry you can't reproduce it in the demo page because I had to make a modification to allow custom attributes to be added so you can't reproduce this issue, I hope the screenshot will be enough, if someone as a lead to help me understand it will be a great help !

Did you read this Do SVG docs support custom data- attributes? — jcubic
– jcubic, Commented Jul 8, 2016 at 14:35
@jcubic The OP doesn't seem to be using the data- API, he has an attribute that's compatible with that API but he's not using the API itself to get the data, just a CSS attribute selector which should work in theory. — Robert Longson
– Robert Longson, Commented Jul 8, 2016 at 14:41

Kld · Accepted Answer · 2016-07-08 15:32:19Z

1

You can try this code

var arr = $('*').filter(function () { return $(this).attr('data-propzone') === "true"; }); console.log(arr);

edited Jul 8, 2016 at 15:32

answered Jul 8, 2016 at 14:46

Kld

7,1183 gold badges39 silver badges50 bronze badges

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

1 Comment

iBadGamer Over a year ago

It does not work. I adapted your code a little with $("*") instead of $(document).children() and you can see the issue here... i.imgur.com/wTWVx0Q.png If the attribute is added it is working fine

Ersian · Accepted Answer · 2016-07-08 14:41:36Z

0

What if you try like this $('*[data-propzone="true"]') ?

answered Jul 8, 2016 at 14:41

Ersian

2192 silver badges12 bronze badges

1 Comment

iBadGamer Over a year ago

What is weird here is that if I add an attribute AFTER the svg is "loaded" in the editor, it's working. You can see it here: imgur.com/RogErdm

Collectives™ on Stack Overflow

Attribute in dom but not usable in a jQuery selector

2 Answers 2

1 Comment

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Linked

Related