Getting result : "undefined"

Question

I have the following piece of code which fires on click of a button with class undo. Here variable cls gives outputs a3, a2 etc. as expected, but when I use cls in

var some = $("path#path"+cls_id).data("id").cls ; ,

I get alert result as undefined. But when I replaced cls with a3 or a2 manually, got the result. Complete code:

$('body').on('click','.undo',function () { 
    var cls_id = $(this).parent().attr('class');
    var cls = $(this).attr('data-undo');
    var some = $("path#path"+cls_id).data("id").cls;
    alert(some);
});

HTML

<path id="path1" stroke="rgb(178, 34, 34)" stroke-width="2" fill="none" d="M683 137 L742 217 L535 301 L513 220" data-id="{ "a1":"L33 24", "a2":"L442 89" }"></path>

Somebody please suggest a way to fix the issue.

You are mixup with `id` and `class` can you post your `HTML` structure ? — Sadikhasan, Mar 14 '15 at 12:16

score 0 · Answer 1 · answered Mar 14 '15 at 12:44

0

If you have defined the element as follow

<div class="test" data-id-cls="me"></div>

Then you should access it as follows

var some = $(".test").data("idCls");

Note the "C" in cls it`s in capital

answered Mar 14 '15 at 12:44

Madhu

2,416
3
15
33

Don't have any problem with data-id. `cls` is the one who makes the problem. – arshad Mar 14 '15 at 13:34

score 0 · Answer 2 · edited May 23 '17 at 11:43

I guess the problem is with the selector path, because there is no element path defined in HTML. Since you already use an id selector #path..., there is also no need to further restrict the selector.

Simply using the id selector should be sufficient, e.g.

var some = $("#path"+cls_id).data("id").cls;

When you look at the data-id attribute, you will see problems with the quoting.

data-id="{ "a1":"L33 24", "a2":"L442 89" }"

When you change the enclosing double quotes to single quotes, you are one step nearer to the solution, e.g.

data-id='{ "a1":"L33 24", "a2":"L442 89" }'

This will give you the object, you are looking for. The second part is adding a cls attribute of course. The missing attribute is the reason, why a1 or a2 work, but cls doesn't

data-id='{ "a1":"L33 24", "a2":"L442 89", "cls": "some value" }'

When cls is not the name itself, but contains the name of the attribute, i.e. a1 or a2, you must access the value with bracket notation

var some = $("#path"+cls_id).data("id")[cls];

or

var obj = $("#path"+cls_id).data("id");
var some = obj[cls];

Getting result : "undefined"

2 Answers2