This is a migrated thread and some comments may be shown as answers.

remove span and classes

1 Answer 37 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Pato
Top achievements
Rank 1
Pato asked on 21 Feb 2017, 09:09 PM

to be able to get the desired menu for my css, i need the following output of menu:

01.<ul id="leftMenu" data-role="menu" class="k-widget k-reset k-header k-menu k-menu-horizontal" tabindex="0" role="menubar"style="display: block;">
02.    <li id="HeaderMain" style="display: inline-block;" class="k-item k-state-default k-first selectedMenu" role="menuitem">
03.        <div class="mnuLiCont">
04.            <div class="mnuHomeIcon"></div>
05.            <div class="mnuTxt">Home</div>
06.        </div>
07.    </li>
08.    <li id="HeaderDashBoard" style="display: inline-block;" class="k-item k-state-default" role="menuitem">
09.        <div class="mnuLiCont">
10.            <div class="mnuDashBoardIcon"></div>
11.            <div class="mnuTxt">Dashboard</div>
12.        </div>
13.    </li>
14.</ul>

 

This is the code im doing to be able to create this menu:

01.@(Html.Kendo().Menu()
02.          .Name("leftMenu")
03.          .Items(items =>
04.          {
05.              items.Add().HtmlAttributes(new { @id = "HeaderMain" , @class = "selectedMenu",@style = "display: inline-block;"});
06.              items.Add().HtmlAttributes(new { @id = "HeaderDashboard", @style = "display: inline-block;" });
07.              items.Add().HtmlAttributes(new { @id = "HeaderExtra", @style = "display: none;" });
08.          })
09.          .HtmlAttributes(new {@style = "display: block"})
10. 
11.        )

 

1.$(document)
2.        .ready(function () {
3.            $("#HeaderMain").append("<div class='mnuLiCont'><div class='mnuHomeIcon'></div><div class='mnuTxt'>Home</div></div>");
4.            $("#HeaderDashboard").append("<div class='mnuLiCont'><div class='mnuDashBoardIcon'></div><div class='mnuTxt'>Dashboard</div></div>");
5.             
6. 
7.        });

 

And in the next code you can see the undesired SPAN in each menu item, which i need to get rid of.

 

01.<ul id="leftMenu" data-role="menu" class="k-widget k-reset k-header k-menu k-menu-horizontal" tabindex="0" e="menubar"style="display: block;">
02.    <li id="HeaderMain" style="display: inline-block;" class="k-item k-state-default k-first selectedMenu" role="menuitem">
03.        <span class="k-link"></span>
04.        <div class="mnuLiCont">
05.            <div class="mnuHomeIcon"></div>
06.            <div class="mnuTxt">Home</div>
07.        </div>
08.    </li>
09.    <li id="HeaderDashBoard" style="display: inline-block;" class="k-item k-state-default" role="menuitem">
10.        <span class="k-link"></span>
11.        <div class="mnuLiCont">
12.            <div class="mnuDashBoardIcon"></div>
13.            <div class="mnuTxt">Dashboard</div>
14.        </div>
15.    </li>
16.</ul>

 

1 Answer, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 22 Feb 2017, 09:22 AM
Hello Pato,

This is a second identical thread opened with the same subject, but this one's product (RadMenu for ASP.NET AJAX) is incorrect. I am switching the product to Menu for ASP.NET MVC and closing the thread. If you have more  questions on this matter you can post them in the other forum thread or in the support ticket you opened.

Regards,
Ivan Danchev
Telerik by Progress
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.
Tags
Menu
Asked by
Pato
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or