Is there a way to offset the 'each' iteration when using the Jade template engine?
for example, when passing in the object named list:
ul
each item in list
li #{item}
Will output
<ul>
<li> Item 1 </li>
<li> item 2 </li>
<li> item 3.....
...
</ul>
But I want the first item to be displayed differently than the rest of the items, like so:
<ul>
<li> Item 1: First Item in list! </li>
<li> item 2 </li>
<li> item 3.....
...
</ul>
So does anyone know a way to offset the 'each' statement in Jade so that I can render the first item separately and then render each following item starting at the 2nd index?
each item, i in list
li= item
if i === 1
| : First item in list!
If #Johnathan's answer does not work for you:
In Jade 1.7 the following works:
for item, i in list
li= item
if i === 0
| : First item in list!
http://www.learnjade.com/tour/iteration/
Also note the 0 index vs 1 index.
Related
I have a dropdown menu with 7 values and these 7 values are stored in the form of list items under unordered list as:
<ul class="rcbList" style="list-style:none;margin:0;padding:0;zoom:1;">
<li class="rcbItem ">--Select--</li>
<li class="rcbHovered ">PIPL-C1-BH-RILJM</li>
<li class="rcbItem ">PIPL-C1-BH1-RILJM</li>
<li class="rcbItem ">PIPL-C1-BH2-RILJM</li>
<li class="rcbItem ">PIPL-C1-BH-RPLJM</li>
<li class="rcbItem ">PIPL-C1-DHJ-RPLJM</li>
<li class="rcbItem ">PIPL-C1-DHJ-RILJM</li>
</ul>
I want to click on each value of this dropdown menu using for loop with the help of selenium chromedriver in python.
Suppose I want to click on 2nd value PIPL-C1-BH-RILJM, I can do it as :
driver.find_element(By.XPATH,"//div[#id='ContentPlaceHolder1_rcmbCapacityTranch_DropDown']/div/ul/li[2]").click()
But to use it in the for loop, I have to do indexing on li tag. So, when I write as:
i=2
driver.find_element(By.XPATH,"//div[#id='ContentPlaceHolder1_rcmbCapacityTranch_DropDown']/div/ul/li['+str(i)+']").click()
It shows only --Select-- and does not select the 2nd value and same happens with other values of i.
I have also tried as:
i=2
driver.find_element(By.XPATH,"//div[#id='ContentPlaceHolder1_rcmbCapacityTranch_DropDown']/div/ul/li['"+str(i)+"']").click()
But --Select-- is selected again from the dropdown menu.
So, can anyone please help me to click on a particular value with indexing on li tag.
Any help would be appreciated.
Try like below once:
Collect all the li tag elements in a list and then iterate over them. Use find_elements for the same.
# This should highlight all the li tags - //div[#id='ContentPlaceHolder1_rcmbCapacityTranch_DropDown']/div/ul/li
options = driver.find_elements(By.XPATH,"//div[#id='ContentPlaceHolder1_rcmbCapacityTranch_DropDown']/div/ul/li")
# This should print 7
print(len(options))
# Start the loop from index 1 since the first option is "--Select--"
for i in range(1,len(options)):
options[i].click()
I have the following list;
* unordered item 1
* unordered item 2
* unordered item 3
How would I use wrap with abbreviation (ctrl+shift+G) or (ctrl+shift+A) and remove the
* unordered and be left with just the item and number. I am using Sublime Text 3 on Linux
and I select the text above then ctrl+shift+G Then I want to create an unordered list nav bar.
So in the wrap with abbreviation window I type nav>ul.nav>li.nav-items$*>a|t and the result of
this is;
<nav>
<ul class="nav">
<li class="nav-item1">unordered item 1</li>
<li class="nav-item2">unordered item 2</li>
<li class="nav-item3">unordered item 3</li>
</ul>
</nav>
I removed the * but not the unordered. I know the |t is the Emmet trim filter. Is there a
way to pass this filter a number value to tell it how many items or words to trim?
What I want to be left with after applying |t (the trim filter) is;
<nav>
<ul class="nav">
<li class="nav-item1">item 1</li>
<li class="nav-item2">item 2</li>
<li class="nav-item3">item 3</li>
</ul>
</nav>
Emmet removes only well-known list markers like numbers or bullets. It’s much better and easier to remove something else using native editor features like column selection
I am trying to get to the texts inside the span tags by iterating through the li list of this HTML:
<ol class="KambiBC-event-result__score-list">
<li class="KambiBC-event-result__match">
<span class="KambiBC-event-result__points">1</span>
<span class="KambiBC-event-result__points">1</span>
</li>
</ol>
but i am getting the error
AttributeError: 'list' object has no attribute
'find_element_by_class_name'
on my code:
meci = driver.find_elements_by_class_name('KambiBC-event-result__match')
for items in meci:
scor = meci.find_element_by_class_name('KambiBC-event-result__points')
print (scor.text)
You are not using items inside the loop. You loop should be
meci = driver.find_elements_by_class_name('KambiBC-event-result__match')
for items in meci:
scor = items.find_element_by_class_name('KambiBC-event-result__points')
print (scor.text)
meci.find_element_by_class_name should be items.find_element_by_class_name
To answer your second comment, all you need to do is add ":nth-child(2)" to the end of the class name.
The class 'KambiBC-event-result__points' would read 'KambiBC-event-result__points:nth-child(2)' to only access the second child.
So I've stupidly designed a list of recent articles, all is good with the world BUT the first 2 entries html are markedly different then the remainder of entries.
I am yet to turn a line of code so any advice anyone an offer is greatly appreciated.
Simplistically the ul would look like:
<li class="1of2"> /* It's number 1 – give it a class to identify it as special */
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
<li class="1of2"> /* It's number 2 – give it a class to identify it as special */
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
<li> /* It's not number 1 or 2 – ie. every other item, NO class per se */
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
If you imagine a 3 column grid for all entries but the first 2 entries are 1.5 columns each. Bit of a noodle scratch going on here, any thoughts gratefully voted upon.
PS. I will be using Stash if that helps !
Just output the class name based on the value of {count}. I've output the whole opening <li> tag here to keep it simple but you could just output the class attribute or class name itself.
{if count<=2}
<li class="special">
{if:else}
<li>
{/if}
<h1>{title}</h1>
... etc.
</li>
Incidentally, I don't think you can have class names that begin with a number.
Here's how I would do it if you want each of the first 2 to have a unique class name:
<li{if count<=2}class="top{count}"{/if}>
that will output
<li class="top1">...
<li class="top2">...
<li>...
If you want the first 2 items to have the same class:
<li{if count<=2}class="whateveryouwant"{/if}>
which will output
<li class="whateveryouwant">...
<li class="whateveryouwant">...
<li>...
Couldn't you do {if count == "1|2"}class="whatever"{/if} ?
Seems you are asking for two unique classes, one for the first entry and one for the second entry. In that case, this will work:
{if count == 1}
<li class="first">
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
{if:else if count == "2"}
<li class="second">
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
{if:else}
<li>
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
{/if}
Also, class names that start with a number will not validate.
You could do it with simple conditionals as well if there is no "other" class that would then require the if:else part of the conditional:
<li{if count == "1"} class="first"{/if}{if count == "2"} class="second"{/if}">
<h1>{title}</h1>
<p>{short_desc}</p>
</li>
This assumes you don't have any other differences, such as different custom fields in one option versus the other, which MediaGirl's suggestion would handle more elegantly. If the only difference between them is class assignment, this is another alternative.
<ul>
<li class="selected cell">test</li>
<li class="cell">test2</li>
</ul>
How can I select only the .selected .cell element?
Y.one('.selected, .cell') <= This selects boths li elements. and I just want to select the first element.
Is there something like?
Y.one('.cell').one('.selected') ???
.selected.cell
Notice the lack of space between them.