Menu inside MobileNavBar

2 posts, 0 answers
  1. Anamika
    Anamika avatar
    157 posts
    Member since:
    Mar 2014

    Posted 26 Sep Link to this post

    Hello,

     

    In my Kendo mobile app in MobileLayout Header i want a Dropdown menu on right handside. To achieve this i am using MobileNavBar in Header and tried to put a menu inside. But it does not work. In attached Picture i have used a MobileButton inside navbar with 3 horizontal bar. So it Looks ok. Now when clicking on this button i want a Dropdown menu. is it achievable? If yes how. Here is my code so far

    @(Html.Kendo().MobileView()
    .Name("Adressen")
    .Stretch(true)
    .Layout("mobile-tabstrip")
    .Content(@<text>
    @AdressGrid()
    </text>)
    )

    @(Html.Kendo().MobileLayout()
    .Name("mobile-tabstrip")
    .Header(obj => NavBarTemplate(this))
    .Footer(
    @<text>
    @(Html.Kendo().MobileTabStrip()
    .Items(items =>
    {
    items.Add().Text("Adresse").HtmlAttributes(new { @data_icon = "vendor-e" });
    items.Add().Text("Sms").HtmlAttributes(new { @data_icon = "share" });
    items.Add().Text("Detail").HtmlAttributes(new { @data_icon = "home" });
    items.Add().Text("Home").HtmlAttributes(new { @data_icon = "home"});
    items.Add().Text("Home").HtmlAttributes(new { @data_icon = "gps-e" });
    })
    )
    </text>)
    )

    @helper NavBarTemplate(WebViewPage page)
    {
    @(Html.Kendo().MobileNavBar()
    .Content(navbar =>
    @<text>
    @navbar.ViewTitle("Adressen")
    @(Html.Kendo().MobileButton()
    .Align(MobileButtonAlign.Right)
    .HtmlAttributes(new { @class = "nav-button" ,@data_icon = "arrow-e"})
    .Text(""))
    </text>)
    )

    }

    Thanks

     

    Anamika

     

  2. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    612 posts

    Posted 27 Sep Link to this post

    Hi Anamika,

    I have just answered to the question in the support ticket, that you have opened on the same topic. In case you have any further questions, I would suggest you to continue our communication in that thread.

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top