Unique id in dynamically added control's event handler

[Mike]

Hi.

For some reason I'm really struggling to pass a unique identifier to a function declared in the Change event of dynamically added sliders.  After (document).ready I am pulling in a JSON object and parsing it to create panalbars (as well as other controls) based on data in the object.  That all works fine, but when I dynamically create the slider and set the function I want to trigger on the Change event, any variable I set is shared between all the sliders (eventhough the values were unique at the time I initiated each slider in code) and I can't figure out how to reference the sender from the event function to reference a unique id. 

In other words, what I am trying to do is dynamically create sliders with ids A, B, C.... that have their change events pointing to the same function that can not only pick up the unique value change per panelbar (e.value) but also capture the slider's unique id.

Can someone provide guidance please?  I've been working on this problem much longer than I care to admit.

Thanks,
Mike

EDIT: sorry, I posted this to the wrong forum.  I don't know how to move or delete posts.

[Hristo Germanov]

Hi Mike,

Unfortunately I am not able to reproduce this issue locally. Could you please send us a simple test jsFiddle/jsBin which reproduces the depicted issue? Thus I will be able to observe the problem and advice you further.

All the best,
Hristo Germanov
the Telerik team

[Mike]

So I'm probably doing something dumb, but in this example: http://jsfiddle.net/mwrothbe/kTkZn/8/ how can I get the function SetDM to not only get the value but the id of the control that changed?  I tried $(this) and some other things, but I haven't figured out how to capture the sender's id.

The idea here is the json object can contain any number of sub objectc so I want to instantiate the sliders dynamically, point the change events to a single function and still be able to identify which slider changed as well as the value of the change.

Thanks,
Mike

[Hristo Germanov]

Hello Mike,

1) You can get the html element and then you can access the id of the slider:

function SetDev(e) {
   console.log(this.element.attr("id"));
}

2) You can pass the id via options of the slider:

$("#" + json[dev].ID + "Slide").kendoSlider({
  change: SetDev,
  id: json[dev].ID
});

and

function SetDev(e) {
  console.log(this.options.id);
}

All the best,
Hristo Germanov
the Telerik team

[Mike]

THank you.  This worked perfectly.  I must have been having syntax problems.

Thanks,
Mike