How to select elements inside two elements using xpath? - xpath

<ul class="pagination">
<li class="arrow unavailable">«</li>
<li class="current">1</li>
<li><a
<li><a onclick="3</a></li>
<li><a onclick="4</a></li>
<li><a onclick="5</a></li>
<li><a onclick="6</a></li>
<li><a onclick="7</a></li>
<li class="unavailable">…</li>
<li><a onclick="21);return false;" href="#">21</a></li>
How would I select all "A" in between current and unavailable?

To those that read this in the future, this is what worked for me.
/UL[1]/LI[#class=''][span("li[#class='unavailable']")][#class != 'current']/a

Related

TinyButStrong Block Not Working for li tag

If I define my block on the li tag, TBS only shows the first item in the array.
<ul class="nav navbar-nav">
<li class="dropdown nav-item">
Logs<span class="caret"></span>
<ul class="dropdown-menu" role="menu">
<li><a class="file" href="/logs/#[logs.key; block=li]">[logs.key]</a></li>
</ul>
</li>
<li class="nav-item">Settings</li>
<li class="nav-item"><span class="navbar-text" id="grepspan"></span></li>
<li class="nav-item"><span class="navbar-text" id="invertspan"></span></li>
</ul>
If I define the block on the a tag, it shows all the items in the array.
<ul class="nav navbar-nav">
<li class="dropdown nav-item">
Logs<span class="caret"></span>
<ul class="dropdown-menu" role="menu">
<a class="file" href="/logs/#[logs.key; block=a]">[logs.key]</a>
</ul>
</li>
<li class="nav-item">Settings</li>
<li class="nav-item"><span class="navbar-text" id="grepspan"></span></li>
<li class="nav-item"><span class="navbar-text" id="invertspan"></span></li>
</ul>
What am I doing wrong here?

xpath for a table using multiple nodes and conditions

I have a table and I want to find the xpath for a button that has multiple nodes to make the difference between rest of buttons
Here is the xpath
<div id="widget-results-tabs" class="">
<ul class="widget-results-list">
<li class="widget-results-list-item">
<li class="widget-results-list-item active">
<span class="active" data-action="widgetResults">Spania</span>
<ul class="widget-results-list">
<li class="widget-results-list-item">
<li class="widget-results-list-item active">
<span class="active" data-action="widgetResults">Clasament</span>
<ul class="widget-results-list widget-results-list-dropdown">
</li>
</ul>
</li>
<li class="widget-results-list-item">
<li class="widget-results-list-item">
<li class="widget-results-list-item">
<li class="widget-results-list-item">
<li class="widget-results-list-item">
<li class="widget-results-list-item">
</ul>
</div>
I want to find the xpath for "Clasament" from "Spania"
I've tried something like this
//ul/li/span[contains(.,'Spania')]/li/span[contains(.,'Clasament')]
but it doesn't work...
Can you help me with the right xpath that will contains the condition "Spania" and condition "Clasament" ?
Try below XPath to match required li node:
//li[./span='Spania']//li[./span='Clasament']

Top-bar Drowndown Links Not Working

I have the top-bar nav all setup and the dropdowns are displaying as expected. However, when I click on a dropdown link, the dropdown just disappears. The page does not advance to the URI as expected.
I'm stumped...
<section class="top-bar-section second-row">
<ul>
<li class="active"><i class="fa fa-exclamation-triangle"></i><span> Alert Central</span></li>
<li class="has-dropdown">
<i class="fa fa-bar-chart"></i><span> Analytics</span>
<ul class="dropdown">
<li>System Status</li>
<li>My Use</li>
<li>My User's Use</li>
<li>Account Information</li>
</ul>
</li>
<li class="has-dropdown">
<i class="fa fa-magic"></i><span> Filter Management</span>
<ul class="dropdown">
<li>Keywords</li>
<li>Categories</li>
<li>Locations</li>
</ul>
</li>
<li class="has-dropdown">
<i class="fa fa-users"></i><span> User Management</span>
<ul class="dropdown">
<li>Users</li>
<li>Roles</li>
</ul>
</li>
</ul>
</section>
Did you try to add data-topbar in <section> tag ?
<section data-topbar class="top-bar-section second-row">

How to internationalize a Thymeleaf nested list?

Let's say I have a basic static HTML page that contains a nested unordered list:
<ul>
<li>Item 1</li>
<li>Item 2
<ul>
<li>Sub-item 2.1</li>
<li>Sub-item 2.2</li>
</ul>
</li>
<li>Item 3</li>
</ul>
That's valid XHTML. Great.
Now, I'm applying Thymeleaf's internationalization via th:text (if it matters, and I don't believe it does, this is inside a Spring application).
<ul>
<li th:text="#{mypage.item1}">Item 1</li>
<li th:text="#{mypage.item2}">Item 2
<ul>
<li th:text="#{mypage.item2.1}">Sub-item 2.1</li>
<li th:text="#{mypage.item2.2}">Sub-item 2.2</li>
</ul>
</li>
<li th:text="#{mypage.item3}">Item 3</li>
</ul>
Assuming that I have my mypage.properties set up and working properly, once the above is processed by Thymeleaf, the result will display as:
<ul>
<li>Item 1</li>
<li>Item 2
</li>
<li>Item 3</li>
</ul>
Where did my sub-items go for Item 2, and how can I get them back while having them i18n'ed separately? I know about th:utext, but I do not want to have mypage.item2 contain the full HTML for the entire sublist. Is it possible?
Edit: It is possible to get what I'm looking for if I change my code to the following, but then it is no longer valid XHTML. I am looking for a valid XHTML solution.
<ul>
<li th:text="#{mypage.item1}">Item 1</li>
<li th:text="#{mypage.item2}">Item 2</li>
<ul>
<li th:text="#{mypage.item2.1}">Sub-item 2.1</li>
<li th:text="#{mypage.item2.2}">Sub-item 2.2</li>
</ul>
<li th:text="#{mypage.item3}">Item 3</li>
</ul>
First for understanding: th:text change everything till the tag is closed, so the behavior is not a surprise.
<ul>
<li th:text="#{mypage.item1}">Item 1</li>
<li><span th:text="#{mypage.item2}" th:remove="tag">Item 2</span>
<ul>
<li th:text="#{mypage.item2.1}">Sub-item 2.1</li>
<li th:text="#{mypage.item2.2}">Sub-item 2.2</li>
</ul>
</li>
<li th:text="#{mypage.item3}">Item 3</li>
</ul>
should work or with newer version you could use th:block
<ul>
<li th:text="#{mypage.item1}">Item 1</li>
<li><th:block th:text="#{mypage.item2}">Item 2</th:block>
<ul>
<li th:text="#{mypage.item2.1}">Sub-item 2.1</li>
<li th:text="#{mypage.item2.2}">Sub-item 2.2</li>
</ul>
</li>
<li th:text="#{mypage.item3}">Item 3</li>
</ul>
With th:inline it should be possible to avoid the extra node th:block.

Sub Menu of a Horizontal Drop down Menu is not overflowing. It is visible partly up to main Post body

I have a problem with my newly created Blogspot site ( http://www.sanzuu.blogspot.com ) .
Sub Menu of a Horizontal Drop down Menu is not overflowing. It is visible partly up to the main Post body. Please help me.
<div id='menuWrapper'>
<ul class='menu'>
<li class='top'><a class='top_link'href='http://sanzuu.blogspot.com'><span>HOME</span> </a></li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/search/label/ELECTRONICS?max-results=5'><span class='down'>ELECTRONICS</span></a>
<ul class='sub'>
<li><a href='http://sanzuu.blogspot.com/search/label/BASIC%20ELECTRONICS?max- results=5'>BASIC ELECTRONICS</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/COMPUTER?max- results=5'>COMPUTER</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/MOBILE PHONE?max-results=5'>MOBILE PHONE</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/HOME%20APPLIANCES?max-results=5'>HOME APPLIANCES</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/CIRCUIT%20DESIGN?max-results=5'>CIRCUIT DESIGN</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/ELECTRONICS%20PROJECT?max-results=5'>ELECTRONICS PROJECT</a></li>
</ul>
</li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/search/label/TUTORIALS?max-results=5'><span class='down'>TUTORIALS</span></a>
<ul class='sub'>
<li><a href='http://sanzuu.blogspot.com/search/label/COMPUTER?max- results=5'>COMPUTER</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/MOBILE?max-results=5'>MOBILE</a> </li>
<li><a href='http://sanzuu.blogspot.com/search/label/INTERNET?max- results=5'>INTERNET</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/RUBIKs%20CUBE?max- results=5'>RUBIKs CUBE</a></li>
</ul>
</li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/search/label/VIDEOS?max-results=5'><span class='down'>VIDEOS</span></a>
<ul class='sub'>
<li><a href='http://sanzuu.blogspot.com/search/label/PLACE%20TO%20VISIT?max- results=5'>PLACE TO VISIT</a></li>
<li><a href='http://sanzuu.blogspot.com/search/label/GAMING?max-results=5'>GAMING</a> </li>
</ul>
</li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/search/label/WHAT%20IT%20IS%20?max-results=5'>WHAT IT IS ? </a></li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/search/label/RECIPE?max-results=5'><span>RECIPE</span></a> </li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/search/label/COMPLAINTS?max-results=5'>COMPLAINTS</a></li>
<li class='top'><a class='top_link' href='http://sanzuu.blogspot.com/p/contact- us.html'>CONTACT US</a></li>
<!-- Search Bar -->
<li>
<form action='/search' id='search' method='get' name='searchForm' style='display:inline;'>
<input id='search-box' name='q' onblur='if (this.value == "") this.value = "Search here...";' onfocus='if (this.value == "Search here...") this.value = "";' size='28' type='text' value='Search here...'/></form>
</li>
</ul>
</div>
The cut off submenu is because you have the property overflow:hidden on your .tabs-outer container element.
Just track down that style and change it to:
.tabs-outer{
overflow:visible;
}
Here's a JSfiddle showing you the applied style - note that the submenus are no longer cut off. Hope this helps! Let me know if you have any questions.
(Note that in the future, please attempt to include the relevant CSS as well - otherwise, the question becomes harder to answer and also less useful to others who read it later.)

Resources