Thymeleaf nested list not working - nested

I'm trying to get the nested list working in Thymeleaf. I have tried not nesting the list and the entry.value works. However when I start nesting it, it doesnt show up in the webpage. Students is a Map<String, ArrayList<String>>.
<ul th:each="entry : ${students}">
<li th:text="${entry.key}">
<ul>
<li th:text="${entry.value[0]}"></li>
<li th:text="${entry.value[1]}"></li>
<li th:text="${entry.value[2]}"></li>
</ul>
</li>
</ul>
Currently it looks like this.

th:text attributes replace all any child html elements with the contents of the th:text expression. You have to move the th:text into it's own tag, something like this:
<ul th:each="entry: ${students}">
<li>
<span th:text="${entry.key}" />
<ul>
<li th:text="${entry.value[0]}" />
<li th:text="${entry.value[1]}" />
<li th:text="${entry.value[2]}" />
</ul>
</li>
</ul>

Related

Selenium - How to determine the value on click (findElement)?

If I have a header on HTML like these:
<li class="nav-item px-1 pt-1">
<a class="nav-link" href="http://localhost/ciblog/">Home</a>
</li>
<li class="nav-item px-1 pt-1">
<a class="nav-link" href="http://localhost/ciblog/Book">Book</a>
</li>
<li class="nav-item px-1 pt-1">
<a class="nav-link" href="http://localhost/ciblog/TestCreate">Create</a>
</li>
and I want to click on "Book", how do it?
Here's what I tried:
await driver.findElement(By.css('a.nav-link')).click();
and I'm understand that won't work because all of them have nav-link class, how do I call the specific value of book? on Selenium IDE you can just input value = Book
You can locate it with XPath:
await driver.findElement(By.xpath("//a[contains(text(),'Book')]")).click();
Or with css selector
await driver.findElement(By.css("a[href*='Book']")).click();
I would say to go ahead with linkText :
await driver.findElement(By.linkText("Book")).click();

CheerioJS get specific <li> where header text 'What I Want'

I'm trying to get li elements where the header is 'What I want'
This is my Code:
let wants = []
$$('li').each((wantIdx, wantElement) => {
const want= $(relatedArticleElement).text()
wants.push(want)
})
and this is the HTML i'm trying to parse from:
<div class="side-list-panel">
<h4 class="panel-header">What I Want</h4>
<ul class="panel-items-list">
<li>
1
</li>
<li>
2
</li>
<li>
3
</li>
<li>
4
</li>
<li>
5
</li>
</ul>
</div>
<div class="side-list-panel">
<h4 class="panel-header">What I don't want</h4>
<ul class="panel-items-list">
<li>
a
</li>
<li>
b
</li>
<li>
c
</li>
<li>
d
</li>
<li>
e
</li>
</ul>
</div>
this code gets me every single li elements in the page obviously, is there any way i can only get the lis under the 'What I Want' panel-header?
You can get those with:
$('h4:contains("What I Want") + ul li').get().map(li => $(li).text())
You can try JQuery's contains if Cheerio supports it Example $('td:contains("male")')

Create a Bootstrap menu with WayFinder

Trying to create a Bootstrap menu with WayFinder. How to finish it?
<ul class="nav navbar-nav">
<li class="dropdown">
Dropdown <span class="caret"></span>
<ul class="dropdown-menu" aria-labelledby="drop1">
<li>Action</li>
<li>Another action</li>
<li>Something else here</li>
<li role="separator" class="divider"></li>
<li>Separated link</li>
</ul>
</li>
<li class="dropdown">
Dropdown <span class="caret"></span>
<ul class="dropdown-menu" aria-labelledby="drop2">
<li>Action</li>
<li>Another action</li>
<li>Something else here</li>
<li role="separator" class="divider"></li>
<li>Separated link</li>
</ul>
</li>
</ul>
My WayFinder call so far:
[[Wayfinder? &startId=`0` &level=`1`
&hideSubMenus=`TRUE` &includeDocs=`1,2,3,4,5,55,7,8,74`
&outerTpl=`chunk_navigation-menu`]]
And my chunk_navigation-menu looks like this:
<ul class="navbar-nav nav">[+wf.wrapper+]</ul>
First of all, I am assuming you are using MODX Evolution.
The easiest way to do that is using
&outerClass
&parentClass
&innerClass
&parentRowTpl
In your Wayfinder call.
It should look like this:
[[Wayfinder? &startId=`[(site_start)]` &level=`2` &outerClass=`nav navbar-nav` &parentClass=`dropdown` &innerClass=`dropdown-menu` &parentRowTpl=`navbar_parentRowTpl`]]
Note: If you don't use [(site_start)] in your context(s), replace it with your menu's parent resource ID.
Also in this case you would have to create the navbar_parentRowTpl. This chunk should look like this:
<li[+wf.id+][+wf.classes+] class="dropdown" id="menu[+id+]">
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#menu[+id+]" href="[+wf.link+]" title="[+wf.title+]">
[+wf.linktext+]
<b class="caret"></b>
</a>
[+wf.wrapper+]</li>
As it's been a long time I don't work with Evo, if there is some problem with this code let me know and I can help you.
I used this example as reference: https://gist.github.com/mkay/f0afc97ec1536932e0a3
And used this table to convert to the Evo syntax:
https://rtfm.modx.com/revolution/2.x/making-sites-with-modx/tag-syntax

The ui:repeat tag outputs itself on the generated html

The following code outputs the ui:repeat tag on the genereated html, and its breaking my layout.
<nav role="navigation" class="f_left f_xs_none d_xs_none t_xs_align_l">
<ul class="horizontal_list main_menu clearfix">
<ui:repeat value="#{categoryBean.rootCategories}" var="cat">
<li class="relative f_xs_none m_xs_bottom_5">
<a href="#{cat.url}" class="tr_delay_hover color_light tt_uppercase">
<b>#{cat.name}</b>
</a>
</li>
</ui:repeat>
</ul>
</nav>
Here the Output generated by the code above:
<nav role="navigation" class="f_left f_xs_none d_xs_none t_xs_align_l">
<ul class="horizontal_list main_menu clearfix"><ui:repeat>
<li class="relative f_xs_none m_xs_bottom_5">
<a href="florestal" class="tr_delay_hover color_light tt_uppercase">
<b>Florestal</b>
</a>
</li></ui:repeat><ui:repeat>
<li class="relative f_xs_none m_xs_bottom_5">
<a href="jardinagem" class="tr_delay_hover color_light tt_uppercase">
<b>Jardinagem</b>
</a>
</li></ui:repeat><ui:repeat>
<li class="relative f_xs_none m_xs_bottom_5">
<a href="pragas-urbanas" class="tr_delay_hover color_light tt_uppercase">
<b>Pragas Urbanas</b>
</a>
</li></ui:repeat>
</ul>
</nav>
BalusC, thanks for JSF version tip, I looked the Mojarra changelog and I found a bug on ui:repeat, I updated to Mojarra 2.2.7 and the problemn was solved.

How do I select a JS tab in watir-webdriver?

I have a webpage which has tab list, the HTML looks like this for this piece:
<div id="content">
<div class="col span-6">
<div class="section first no-border">
<h2>New Search</h2>
<ul class="tabs clear">
<li id="simple-li" class="current">
<a onclick="switch_search_type('SimpleSearch');; return false;" href="#">Simple</a>
</li>
<li id="structured-li">
<a onclick="redirect_to_search('/search/structured_searches/new'); return false;" href="#">Wizard</a>
</li>
<li id="advanced-li" class="">
</li>
<li id="custom-li" class="">
<a onclick="switch_search_type('ComplexQuerySearch');; return false;" href="#">Custom</a>
</li>
</ul>
<div class="tabbed-panel">
I want to select the "Custom" item in this tab list. I tried multiple things but have failed, some of the things I tried:
browser.li(:id, "custom-li").click
browser.select_list(:id, "custom-li").set("Custom")
browser.link(:xpath, "id('custom-li')/x:a").click
browser.select_list(:id => 'custom-li').select "Custom"
I am new to watir-webdriver. Any feedback and help is greatly appreciated.
Try this:
browser.a(:text => "Custom").click

Resources