Setting Tab width on client side

[RJ]

Hi All,

I've been trying to set my tab width on client side but its not working. There is no error but changes are not being applied. This is based on Clients screen resolution. 1024x768 and below will be 150px tab width, higher than 1024x768 300px tab width.

Heres my code

var Mytab;
function OnClientLoad(sender)
{
   Mytab = sender;
   var scrW = screen.width;
   var scrH = screen.height;
   var val;

   if (scrW <= 1024){
      val = "150px";
   }else{
      val = "300px";
   }
   for (var i = 0; i < Mytab.get_allTabs().length; i++)
   {
      Mytab.get_allTabs()[i].width = val;
   }
}


<telerik:RadTabStrip ID="MyTab" runat="server" EnableEmbeddedSkins="False" OnClientLoad="OnClientLoad" .....

Thanks in advance,
Rj

[Princy]

Hi RJ,

Try the following JavaScript code in your OnClientLoad event.

JavaScript:

Mytab.get_allTabs()[0]._element.style.width = val;

Thanks,
Princy.

[RJ]

Thanks a lot Princy it works!

Though after testing it in different client resolution, it seems like I need to change not just the width but the css of the tab. Is it possible to do that? Thanks again

[Princy]

Hi RJ,

I guess you want to set a CSS class for the respective tabs. Please try the following JavaScript code.

JavaScript:

for (var i = 0; i < Mytab.get_allTabs().length; i++) {
    Mytab.get_allTabs()[i].set_cssClass("style1");
}

CSS:

<style type="text/css">
    .style1
    {
        width: 150px;
    }
</style>

Thanks,
Princy.

[RJ]

Thanks so much Princy..

I just wonder where did you find those javascript property. Cant find those on http://www.telerik.com/help/aspnet-ajax/introduction.html

[Shinu]

Hi RJ,

The set_cssClass() is a method of the RadTab client object. Please have a look at this documentation where you can find all the properties and methods of RadTab client object.

Thanks,
Shinu.

[Plamen]

Hello RJ,

 
The get_allTabs() method is shown in this help topic. It seems that the set_cssClass is not described in the RadTab object article but it is typical for RadControls and almost all of them have one. We will add it as soon as we can.

Regards,
Plamen
Telerik

[RJ]

Thanks Plamen