PDA

View Full Version : [CLOSED] Scroll a TabStrip using JavaScript



extnetuser
Jun 03, 2013, 3:53 PM
Hi,

I want a (scrollable) TabStrip control to scroll to a specific tab item using JavaScript without activating the tab. Is this possible at all?


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>

@Html.X().ResourceManager()

@(Html.X().Panel()
.Width(400)
.TopBar(Html.X().Toolbar().Layout(LayoutType.Fit). Items(
Html.X().TabStrip().ID("MyTabStrip").Flex(1).Items(it => {
it.Add(Html.X().Tab().Text("looooooooong text 1"));
it.Add(Html.X().Tab().Text("looooooooong text 2"));
it.Add(Html.X().Tab().Text("looooooooong text 3"));
it.Add(Html.X().Tab().Text("looooooooong text 4"));
it.Add(Html.X().Tab().Text("looooooooong text 5"));
it.Add(Html.X().Tab().Text("looooooooong text 6"));
it.Add(Html.X().Tab().Text("looooooooong text 7"));
})
))
.Items(Html.X().Button().Text("ScrollTo").OnClientClick("Ext.getCmp('MyTabStrip').scrollBy(56)"))
)

</body>
</html>

Vladimir
Jun 03, 2013, 6:08 PM
If TabStrip is scrollable then try this


App.TabStrip1.layout.overflowHandler.scrollBy(100)

extnetuser
Jun 04, 2013, 10:50 AM
Thank you, Vladimir.
If you want to scroll to a specific tab, you can use


App.FormTabStrip.layout.overflowHandler.scrollToIt em(App.TabToScrollTo);

Thread can be marked as closed.