How to Add Separator in Kendo Menu Using the DataSource

6 posts, 0 answers
  1. IS1A2
    IS1A2 avatar
    5 posts
    Member since:
    Feb 2016

    Posted 21 Jun 2017 Link to this post

    I just upgraded to the latest Kendo Pro: 2017.2.504.  This broke our code in several places. The most significant is that setting the cssClass to 'k-separator' no longer creates a line in the menu to separate menu groups. We used to be able to add a separator like this, but it no longer works:

    <p>let menuItem = {</p><p>  text: '',</p><p>  cssClass: 'k-separator',</p><p>  enabled: false</p><p>}</p

     

  2.
  3. IS1A2
    IS1A2 avatar
    5 posts
    Member since:
    Feb 2016

    Posted 21 Jun 2017 in reply to IS1A2 Link to this post

    let menuItem = {

       text: '',

       cssClass: 'k-separator',

      enabled: false

    }

  5. IS1A2
    IS1A2 avatar
    5 posts
    Member since:
    Feb 2016

    Posted 21 Jun 2017 in reply to IS1A2 Link to this post

    let menuItem = {

       text: "",

       cssClass: "k-separator",

       enabled: false

    }

  7. IS1A2
    IS1A2 avatar
    5 posts
    Member since:
    Feb 2016

    Posted 21 Jun 2017 in reply to IS1A2 Link to this post

    let menuItem = {
       text: "",
       cssClass: "k-separator",
       enabled: false
    }
  8.
  9. IS1A2
    IS1A2 avatar
    5 posts
    Member since:
    Feb 2016

    Posted 21 Jun 2017 in reply to IS1A2 Link to this post

    let menuItem = {
     
       text: "",
     
       cssClass: "k-separator",
     
       enabled: false
     
    }
  11. Dimitar
    Admin
    Dimitar avatar
    423 posts

    Posted 23 Jun 2017 Link to this post

    Hello Lee,

    On the following Plunker example you will find a working implementation of the Kendo UI Menu. If you open the dropdown you will notice that there is a separator after each menu item.

    Can you verify if the above example is working correctly on your end? In case the issue continues to persist, may I ask you to provide a runnable sample which reproduces the problematic behavior?

    Regards,
    Dimitar
    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