CODEWITHSUNDEEP
jquery-ui
Eric J.
Eric J.

Reputation: 150238

jQueryUI Templating: Does It Work, Will It Work?

I have a need to modify the code emitted by jQueryUI Tabs. The tabTemplate option seems ideal for that purpose.

I modified my code to include a custom style:

tabControl = $("#tabs");
tabControl.tabs({
    tabTemplate: '<li><a href="#{href}" class="myClass"><span>#{label}</span></a></li>',
});

However, I found that the emitted code did not change. Then, I came across this ticket

http://bugs.jqueryui.com/ticket/7139

claiming that templating in general is being depreciated (as of 12 months ago).

So... why isn't tabTemplate working, is this solution future-proof, and if not, how can I achieve a similar end?

Upvotes: 1

Views: 236

Answers (1)

Fr&#233;d&#233;ric Hamidi
Fr&#233;d&#233;ric Hamidi

Reputation: 263157

jQuery UI is indeed deprecating the templating options (apparently because their use could result in style inconsistencies with the rest of the library).

According to the bug you link to, the tabTemplate option will be removed in jQuery UI 1.9, so, to be on the safe side, you should avoid using it in your current projects.

An alternative is to add the classes through DOM navigation, as follows:

$("#tabs").tabs({
    // options...
}).tabs("widget").find(".ui-tabs-nav a").addClass("myClass");

This approach works now and will continue to work in the foreseeable future.

Upvotes: 1

Related Questions