I use Html.MenuItem helper in asp .net mvc. I want to use html inside link instead of text only. The helper below:
#Html.MenuItem("Announcement", "Index", "Announcement")
generates in html =>
<li> Announcement </li>
but I want to generate an html like =>
<li>
<a href="/Announcement">
<i class="icon-announcement"></i>
<span>Announcement</span>
</a>
</li>
How can I do that?
You can't do that immediately, because the HTML gets stripped if you pass it in as the parameter.
I suggest you do something like the following:
<li>
<a href='#Url.Action("Announcement", "Index")'>
<i class="icon-announcement"></i>
<span>Announcement</span>
</a>
</li>
Related
I have a context path /userlist and using server side pagination which results in URI like this: http://localhost:8080/userlist/?pageSize=10&page=2.
I am trying to append class to this tag using Thymeleaf dynamically.
<li class="nav-item">
<a class="nav-link" th:with="urls=${new String[]{'/userlist','/userlist/*'}}"
th:classappend="${#arrays.contains(urls, #httpServletRequest.getRequestURI()) ? 'active' : ''}" href="/userlist"
th:href="#{/userlist}">
<span class="nav-icon">
<i class="fas fa-users"></i>
</span>
<span class="nav-link-text"> Manage Users</span>
</a>
</li>
Above works perfectly fine for userlist only. But not for http://localhost:8080/userlist/?pageSize=10&page=2.
Question: What I am missing here?
Normally, i would write something like this:
<li>#Html.ActionLink("Dashboard", "Index", "Account")</li>
To generate this:
Dashboard
What i want to know is whether it is possible to generate the following HTML
<i class="fa fa-dashboard"></i> Dashboard
Without having to create my own custom TagBuilder class.
Thanks for the help.
You can use UrlHelper.Action to generate the url:
<a href="#Url.Action("Index", "Account")">
<i class="fa fa-dashboard"></i> Dashboard
</a>
In my Rails 3.2.16 app with a Bootstrap 2.3 navigation list, I want to write a test that confirms that a specific item is active and that it has the right icon. I'm using rspec 2.14.1 and capybara 2.1.0.
I assume the way to do this is with a capybara has_xpath test, but the classes that I need to check ("active" and "fa-folder-open") as well as the actual text ("Inbox") are at different levels of the HTML hierarchy.
Given this HTML:
<ul class="nav nav-list" role="navigation">
<li class="active">
<a href="/messages/my/inbox">
<i class="fa fa-folder-open fa-fw">
</i> Inbox</a>
</li>
<li class="">
<a href="/messages/my/draft">
<i class="fa fa-folder fa-fw">
</i> Draft</a>
</li>
</ul>
is there an XPath that will confirm that the link with text "Inbox" is "active" and has the "fa-folder-open" icon?
EDIT
I copied the example HTML above the XPath tester, where the Format button not only did some pretty formatting, it removed the closing </i> tags. The raw HTML isn't as pretty:
<ul class="nav nav-list" role="navigation">
<li class="active">
<a href="/messages/my/inbox">
<i class="fa fa-folder-open fa-fw"></i> Inbox
</a> </li>
<li class="">
<a href="/messages/my/draft">
<i class="fa fa-folder fa-fw"></i> Draft
</a> </li>
</ul>
Try with:
expect(page).to have_xpath("//li[contains(#class, 'active')//i[contains(text()='Inbox' and contains(#class, 'fa-folder-open')]")
Nicolas' answer was helpful in suggesting that I use contains.
This SO answer helped me see that I can nest the brackets to find nested nodes.
With some trial and error at www.xpathtester.com, I came up with this XPath:
//li[contains(#class,'active') and a[text()=' Inbox' and i[contains(#class,'fa-folder-open')]]]
EDIT
My XPath above wasn't working on the raw HTML (see edited question). The XPath wasn't finding the " Inbox" text, probably due to the line breaks before the <\a> tags. With thanks to this answer's example of normalize-space() without the text() argument, this XPath works:
//li[contains(#class,'active') and a[normalize-space()='Inbox' and i[contains(#class,'fa-folder-open')]]]
Note that it must look for 'Inbox', not ' Inbox'. normalize-space() strips leading and trailing whitespace (including the line breaks that were causing problems), so the leading space must be removed from the text that it is looking for.
I'm using Zend/Navigation in Zend Framework 2. It prints this:
<ul class="Navigation">
<li>
Home Page
</li>
<li>
Contact
</li>
</ul>
But i want to put a <span> element inside every <li> like this:
<ul class="Navigation">
<li>
<span>
Home Page
</span>
</li>
<li>
<span>
Contact
</span>
</li>
</ul>
Is there any way to do that without using a "partial" solution?
There's no other way, how to change html output from menu view helper (except indentation and <ul> class).
Well, of course, you can write your own menu view helper - extend Zend\View\Helper\Navigation\Menu and override htmlify method:
https://github.com/zendframework/zf2/blob/release-2.2.5/library/Zend/View/Helper/Navigation/Menu.php#L472,
but I think, partial template is much better and easier solution.
For anyone who is intrested this guy has created a helper doing this job. http://cmyker.blogspot.gr/2012/11/zend-framework-2-navigation-menu-to.html
How can I generate action link with custom html inside.
Like following:
<a href="http://blah-blah/.....">
<span class="icon"/>
New customer
</a>
You can use the UrlHelper class :
<a href="<% =Url.Action("Create","Customers") %>">
<span class="icon"/> New customer
</a>
The MSDN link is here : http://msdn.microsoft.com/en-us/library/system.web.mvc.urlhelper.aspx
For newer versions of .net,
replace
href="<% =Url.Action("Create","Customers") %>"
with
href="#Url.Action("Create","Customers")"
to give something like
<a href="#Url.Action("Create","Customers")">
<span class="icon"/> New customer
</a>