RadTab - adding attributes doesn't work

[John]

I'm trying to write a workaround for the bug in your RadTabStrip control that prevents tabs from being hidden and displayed on demand.

So instead of building the tabstrip with some tabs hidden, I now add only the tab items I want displayed initially, then use javascript to add further tab items later.

Here's a snippet of the js code...

var tabStrip = $find('myTabStrip');

var tab = new Telerik.Web.UI.RadTab();
tab.set_text('text');
tab.set_value('pseudo-id_because_ID_field_is_weirdly_not_supported');

var attributes = tab.get_attributes();
attributes.setAttribute("onclick", "alert('hello')");

tabStrip.get_tabs().insert(1, tab);

this runs ok and adds a tab to the page, but the attribute is never set, and when I look at the page source it has never been rendered. The items rendered using server side code with the same settings work fine.

Is there something else I should be doing, or is this another bug?

[Kevin]

Hello John,

When you set an attribute on a RadTab, it doesn't add it to the page markup, but adds it to the jQuery object of the RadTab. Thus, the reason why you can't attach a click event to the RadTab using its attributes.

The only way to add a click event to the newly created tab would be to use jQuery to attach it to the element the RadTab generates, but you would need to add the click event after you add it to the RadTabStrip, otherwise it doesn't have an element to attach itself to.

Here's how you're code would look like:

var tabStrip = $find('myTabStrip');

var tab = new Telerik.Web.UI.RadTab();
tab.set_text('text');
tab.set_value('pseudo-id_because_ID_field_is_weirdly_not_supported');

tabStrip.get_tabs().insert(1, tab);

$telerik.$(tab.get_element()).click(function() { alert("hello"); });

I hope that helps.

[John]

Thanks.

Your explanation partially fixes the problem, inasmuch as I should now be able to add a click event.

But I'm still not sure I understand the reasoning behind your comment, in that I can add click events and attributes if I add an object server-side, yet the client side API which purports to replicate the same functionality only does half the job.

I also want to add a further attribute to hold some custom parameters, but I'm no nearer getting this to work as it seems from your explanation that the client-side "addAttribute()" method is only there for show and doesn't actually do anything useful!

Sorry, but this is all getting quite frustrating. Yesterday I added a RadTabStrip object to our app thinking it would be quicker than writing my own. We then hit the "known" bug which prevents the tab strip from rendering correctly if your api is used to hide tabs or make them visible. Having spent several hours coding a helper class as a workaround I just find that every time I get any nearer I hit another bug that requires a further workaround.

Any ideas on how I can add a custom attribute when adding a RadTab client-side. Alternatively, any timescale on a bug fix for the originally reported problem that made all this additional nugatory work necessary in the first place?

[John]

sorry - should also have said we don't use jquery as we are contractually obligated to support IE6 for some of our clients...

[John]

For the benefit of other users who are wasting similar amounts of time struggling with these bugs, here is the workaround I've used for the bug, using javascript...

var tab = new Telerik.Web.UI.RadTab();
tab.set_text('text'); // works ok
tab.set_value('val'); // also works
tab.get_attributes(),addAttribute('onclick', 'alert("hello")'); // WON'T WORK - telerik code never renders this when you add the object to the page
tabStrip.get_tabs().insert(1, tab); // tab will now render but click won't do anything (see above)

// kludge to get this to work
var element = tab.get_element(); // get reference to the html element added to the page
element.setAttribute('onclick', 'alert("hello")'); // patch in the attributes manually
// TODO - set further attributes here