Telerik Forums
Kendo UI for jQuery Forum
4 answers
608 views
Hi

I have a TabStrip control on my page but I would like to bind each tab to a separate page as opposed to put all the views in the same page:
<div data-role="footer">
    <div data-role="tabstrip">
        <a href="/Clients" data-icon="contacts">Clients</a>
        <a href="/Home" data-icon="organize">Tickets</a>
        <a href="/Settings" data-icon="settings">Settings</a>
    </div>
</div>
But when I click on the tabs I see strange URL results. For example if I am in <domain>/Clients page and click on Home the URL that is generated will be <domain>/Clients#/Home instead of <domain>/Home.

Could you let me know what I am doing wrong?

Thanks in advance
Ron Farko

Kiril Nikolov
Telerik team
 answered on 02 Oct 2013
3 answers
79 views
Hi, 

I've got the following code for my tabs trip, and the icons appear properly when loaded into Safari or Firefox, but when using an iOS 7 device they are not appearing correctly.  The attached screenshot shows how they appear on the iOS 7 device. 

The code for the tabs trip is embedded in a layout.  
Here's the gist showing the relevant code:
  https://gist.github.com/johncclayton/54ba76aa355d8ea74475

I'm using KendoUI mob version: 2013.2.923

Thanks!











Kamen Bundev
Telerik team
 answered on 30 Sep 2013
4 answers
55 views
Hello
I have problem with tabstrip in recent available version 2013.2.716. I've downloaded this version to use new flat skin, but tab strip is now unusable. It is not selecting tab after first click. (it performs navigation, but not indicate state) Second click is not performing navigation (already done) and fix state. Please look at aattached example.
Kamen Bundev
Telerik team
 answered on 02 Aug 2013
8 answers
225 views
I was going through Burke's example for building your first PhoneGap app with Kendo. After some tweaking to the code (that tutorial doesn't work anymore with the current version of PhoneGap) I got the app to load the Kendo Mobile resources and the TabStrip appears, yet it's cut off. It almost looks like the status bar of the iPhone is pushing the entire window down. 

Any idea what I can do to fix this? See the attached screen shot.
Kamen Bundev
Telerik team
 answered on 30 Jul 2013
21 answers
924 views
Hello,
how to add custom icons for the tabstrip that work with the gradients?

i tried the recommended solution but the gradients aren't working. the default icons got svg masks but i guess they're is / has to be a way to add custom icons.
thanks in advance
Ralph
Top achievements
Rank 1
 answered on 26 Jun 2013
3 answers
178 views
Hi Guys,
  I noticed a quirk when testing some code that prevents navigation in before show, as indicated here ... http://docs.kendoui.com/api/mobile/view#events-beforeShow

If I use this technique the tabstrip changes the active tab to the view that was prevented from being displayed, I have a jsfiddle here that demonstrates the issue.  Notice that if you are on view 1, or the view 1 child and you select view 2 (the one that is supposed to be prevented), the navigation is prevented but the tab strip is active on view 2.  I would expect the tabstrip to keep the same tab active as a result of the e.preventDefault call, but perhaps this is deliberate behavior.

  I have a work around for the issue (I just alter the content on view 2 instead of stopping them from navigating to it which is fine for my purposes), so I don't need a fix in a rush I just thought I would bring it to your attention in case you weren't aware.
  -David
Petyo
Telerik team
 answered on 21 Jun 2013
1 answer
146 views
Hello,
           I am opening a modal view when a tabstrip item is selected as shown in the screenshot (Show Modal.png).

In the select method of kendo ui mobile tabstrip I am
preventing  the default event propagation i.e, to show the modal view by using e.preventDefault(),  to show a confirmation dialog box as shown in the screenshot(Prevent Default Action.png). 

Code:-

<div id='modal_tabs' data-role="tabstrip" data-select='tabChange'>
  <a href="#index" data-icon="custom">Home</a>
</div>
function tabChange(e){
                   if (someCondition) {
                        e.preventDefault();
                      showConfirmation(showPopUpMsg, 'Unsaved changes', doTabActiveOnOK); // show confirmation dialog box
                   }
               doTabActiveOnOK = function(button){   // callback function
                      if (button == true) { //  if ok button is pressed
                                 $("#modal_tabs").data("kendoMobileTabStrip").select(1);  // not supported
                            }
                }
}
If  'ok'  button is pressed on the confirmation dialog I want to perform the default action again(to show the modal) or select the tabstrip manually.  How to perform this task?

 Thanks,
Dave.
Petyo
Telerik team
 answered on 20 Jun 2013
1 answer
49 views
I already have a custom icon font I created and have been using elsewhere that is prepended with 'icon-' instead of 'km-'. I have various reasons for wanting to not switch it to us 'km-' within the tabstrip.

How can I do this?
Kamen Bundev
Telerik team
 answered on 12 Jun 2013
3 answers
20 views
I am using forced iOS in my application and it looked fine in Android until I updated to the newest version which supports the badges. The icons on an Android device will show but now they have a blue box overlayed with them.

Is there a workaround for this?  Attached is a sample of the issue.

Robert
Kamen Bundev
Telerik team
 answered on 06 Jun 2013
1 answer
90 views
I have a mobile tabstrip which has 5 tabs.  All the tabs except one will show a different view.  The last tab (more), I would like to show a custom slide up menu.  To get this to work, I tied to bind a data-click event to that one tab, which does not work.  I tried binding the even in my scripts, that did not work.  I tried the data-select event, but that even only fires once for the same tab, so I can't use that event since I can't hit the same tab again to hide my menu.  I am also using MVVM.  Is there anyway to bind an event to a single tab.  

Thanks,
Joe
Petyo
Telerik team
 answered on 18 May 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?