html div expansion - java

In my project I need to expand my div section,when link is clicked,say "see more".
how can this be done?
Check the one which is in www.facebook.com,where each post has see more,if the div section cant contain the section...
This is the screenshot of what i have done
Code:
<div id="page" >
<div id="page-bgtop">
<div id="page-bgbtm">
<div id="content" style="min-height:400px" >
<div class="post" >
<h2 class="title">UPDATES</h2>
<%
try{
st1=con1.createStatement();
ResultSet rs=st1.executeQuery("select * from article ORDER BY artid DESC");
%>
<div style="width:450px; word-wrap: break-word;">
<%
while(rs.next())
{
String s=rs.getString("article");
out.println("<div>");
out.println("<p align ='justify' >"+s+"</p>");
out.println("<hr style='border:dashed #FFFFFF; border-width:1px 0 0 0; height:0;line-height:0px;font-size:0;margin:0;padding:0;'>");
out.println("</div>");
}
%>
</div>
<%
}catch(Exception e){
//System.out.println("exception is "+e);
e.printStackTrace();
}
%>
</div>

You should be able to expose/hide divs using the .show and .hide methods from JQuery as shown here.

Add a javascript function to onclick event of the link. In that javascript function, set the display property of the relevant div to display:hidden or display:block.
Or
You can set a initial height using CSS height property and set overflow-y:hidden
Then onclick of the relevant link, change the height of the div to see all of the content.

Related

Iterate <div> inside <ul> tag Java - Jsoup

I'm trying to get all <div> inside a <ul> tag using jsoup.
This is the HTML
<html>
<head>
<title>Try jsoup</title>
</head>
<body>
<ul class="product__listing product__grid">
<div class="product-item">
<div class="content-thumb_gridpage">
<a class="thumb" href="index1.html" title="Tittle 1">
</div>
</div>
<div class="product-item">
<div class="content-thumb_gridpage">
<a class="thumb" href="index2.html" title="Tittle 2">
</div>
</div>
<div class="product-item">
<div class="content-thumb_gridpage">
<a class="thumb" href="index3.html" title="Tittle 3">
</div>
</div>
</ul>
</body>
</html>
What I'm trying to iterate is all <div class="product-item"> so then I can add to a list all <a class="thumb"> properties
List-product-details
[0] href="index1.html" title="Tittle 1"
[1] href="index2.html" title="Tittle 2"
[2] href="index3.html" title="Tittle 3"
Note that there can be 'N' product-item div
Here is What I got so far:
Elements productList = sneakerList.select("ul.product__listing product__grid");
Elements product = productList.select("ul.product-item");
for (int i = 0; i < product.size(); i++) {
Elements productInfo = product.get(i).select("div.product-item").select("div.content-thumb_gridpage").select("a.thumb");
System.out.format("%s %s %s\n", productInfo.attr("title"), productInfo.attr("href"), productInfo.text());
}
Did you try debugging line by line and checking at which line your code doesn't do what you expect?
I see two mistakes.
The first selector "ul.product__listing product__grid" contains a space. Now it means: find element ul with class product__listing and inside search for element <product__grid> </product__grid>. You probably meant: select element ul having class product__listing and having class product__grid. You have to use dot . before second class name and remove space to look at the same level. So correct selector will be: "ul.product__listing.product__grid".
Second selector you're using is "ul.product-item". It will return empty result. That's because you're already inside ul and you're searching for another ul. Selector should be relative to where you are so using only ".product-item" will be enough.
And now I get the ouput:
Tittle 1 index1.html
Tittle 2 index2.html
Tittle 3 index3.html

How i can select element from a drop down with div tag [duplicate]

This question already has answers here:
'UnexpectedTagNameException' and Element should have been "select" but was "div" error using 'Select' function through Selenium java
(1 answer)
org.openqa.selenium.support.ui.UnexpectedTagNameException: Element should have been "select" but was "span" while selecting a dropdown value
(2 answers)
Closed 2 years ago.
I'm trying to select an option from a drop-down that has a div tag instead of select. With my below code, I am able to open the respective div, however unable to select the element.
This is the HTML tags:
<div id="selectator_LocationListDD" class="selectator_element single options-hidden" style="width:
100%; min-height: 35px; padding: 6px 12px; flex-grow: 0; position: relative;">
<span class="selectator_textlength" style="position: absolute; visibility: hidden;">
</span>
<div class="selectator_selected_items">
<div class="selectator_selected_item selectator_value_">
<div class="selectator_selected_item_title">--Select--</div>
<div class="selectator_selected_item_subtitle"></div>
</div>
</div>
<input class="selectator_input" placeholder="Search here..." autocomplete="false">
<ul class="selectator_options" style="top: 73px;"><li class="selectator_option selectator_value_">
<div class="selectator_option_title">--Select--</div><div class="selectator_option_subtitle">
</div>
<div class="selectator_option_subtitle2">
</div>
<div class="selectator_option_subtitle3">
</div>
</li>
<li class="selectator_option selectator_value_CST0003970">
<div class="selectator_option_title">21ST STREET</div>
<div class="selectator_option_subtitle">1031 21st</div>
<div class="selectator_option_subtitle2">Lewiston, ID</div>
</li>
<li class="selectator_option selectator_value_CST0003214">
<div class="selectator_option_title">3RD & STEVENS</div>
<div class="selectator_option_subtitle">508 W Third Ave</div>
<div class="selectator_option_subtitle2">Spokane, WA</div>
</li>
<li class="selectator_option selectator_value_CST0003956 active">
<div class="selectator_option_title">9TH AVE</div>
<div class="selectator_option_subtitle">600 S 9th Ave</div>
<div class="selectator_option_subtitle2">Walla Walla, WA</div>
</li>
<li class="selectator_option selectator_value_CST0003991">
<div class="selectator_option_title">10TH & BANNOCK</div>
<div class="selectator_option_subtitle">950 W Bannock St, Ste 100</div>
<div class="selectator_option_subtitle2">Boise, ID</div>
</li>
</ul>
</div>
The Code ni has so far is:
Page Object:
#FindBy(id="selectator_LocationListDD")
WebElement locationDD;
public void select_locationEI(int index) throws InterruptedException {
Thread.sleep(2000);
locationDD.click();
Select locationEI = new Select(locationDD);
locationEI.selectByIndex(index+1);
// wait.until(ExpectedConditions.visibilityOfElementLocated
(By.xpath("//div[#class=\"selectator_selected_item selectator_value_\"]//li["+
(index+1)+"]"))).click();
}
step definition:
#When("user added equipment for each location")
public void user_added_equipment_for_each_location() throws InterruptedException {
atmAgreement = new AgreementsATM(driver);
for(int ei: emptyLocation) {
atmAgreement.click_addNewEquipment_tab();
loaderVisibilityWait();
loaderInvisibilityWait();
atmAgreement.select_locationEI(ei);
atmAgreement.enter_modelText();
String dt = reader.getCellData("ATM", "Depositor Type", 2);
atmAgreement.select_depositorType(dt);
String manufacture = reader.getCellData("ATM", "Manufacturer", 2);
atmAgreement.select_manufacturer(manufacture);
atmAgreement.enter_terminalID();
atmAgreement.click_addButtonEI();
loaderVisibilityWait();
}
emptyLocation.clear();
}
I got an org.openqa.selenium.support.ui.UnexpectedTagNameException: Element should have been "select" but was "div".
I'm not sure how to handle this as I've only worked with selects before.
Let's say I wanted to select "9TH AVE" for the agent code. How would I go about this?
Any help is appreciated! Thanks.
Use this xpath and get all the option title (findelements).
//ul//li/div[#class='selectator_option_title']
store above element in yourListOFElements
Once you have the list of webelements you can iterate through each entry and compare the innerHTML
yourListOFElements.get(i).getAttribute("innerHTML")
and compare with your required text.
if matches you can click that element
hope you got the idea.
as I see your dropdown list contains search field
<input class="selectator_input" placeholder="Search here..." autocomplete="false">
the best way is to
Select the main div with id="selectator_LocationListDD"
select the search field inside the main div.
type in the search field a unique part of the option name.
then click on the only displayed <li> inside the main div.
that way you avoid using the index, which can change frequently and use the text in the selection which most likely depends on your inserted Test data so you have full control of it.

Need help- Selenium webdriver- click on element from visible list is not working

I am sending defined data from excel file. I tried some code but they are not selecting all the data from excel file at some point of time code is giving me exception for WebElement not found.
Here is the HTML code:
<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
<div id="addDialog" class="hidden ui-dialog-content ui-widget-content" style="display: block; width: auto; min-height: 30px; height: auto; max-height: 351.05px; overflow-y: auto;">
<div class="field-container">
<fieldset class="field-container">
<legend>Contracts:</legend>
<a class="select-all" href="#">Select All</a>
<a class="deselect-all" href="#">Deselect All</a>
<select id="addContract" class="searchable" multiple="multiple" style="position: absolute; left: -9999px;">
<option value="93370956">93370956</option>
<option value="93796167">93796167</option>
<option value="94203239">94203239</option>
</select>
<div id="ms-addContract" class="ms-container">
<div class="ms-selectable">
<input class="search-input" type="text" placeholder="filter" autocomplete="off"/>
<ul class="ms-list" tabindex="-1">
<li id="86355560-selectable" class="ms-elem-selectable">
<span>93370956</span>
</li>
<li id="202890296-selectable" class="ms-elem-selectable">
<span>93796167</span>
</li>
<li id="938848030-selectable" class="ms-elem-selectable">
<span>94203239</span>
</li>
</ul>
</div>
</div>
Need to select values from list.
Efforts done:
This effort for code worked but it selected only one value and then gave exception
WebDriverWait Wait=new WebDriverWait(driver, 10);
Wait.until(ExpectedConditions.presenceOfElementLocated(By.xpath("//ul[#class='ms-list']/li/span")));
//now you can find element
List<WebElement>options=driver.findElements(By.xpath("//ul[#class='ms-list']/li/span[contains(text(),'"+testData+"')]"));
for (WebElement option: options) {
if(testData.equals(option.getText())) option.click();
}
Tried above code but it only selects one value !!
WebDriverWait Wait = new WebDriverWait(driver, 10);
Wait.until(ExpectedConditions.presenceOfElementLocated(By.xpath("//*[#id='ms-addContract']//descendant::div[#class='ms-selectable']/ul[#class='ms-list']]//span")));
List<WebElement> options = driver.findElements(By.xpath("//*[#id='ms-addContract']//descendant::div[#class='ms-selectable']/ul[#class='ms-list']]//span[contains(text(), '"+testData+"')]"));
for (WebElement option : options) {
if(testData.equals(option.getText()))
option.click();--tried this xpath-no success
WebDriverWait wait = new WebDriverWait(driver, 10);
wait.until(ExpectedConditions.visibilityOfElementLocated(By.xpath(".//*[#id='ms-addContract']/div[1]/input"))).click();
driver.findElement(By.xpath(".//*[#id='ms-addContract']/div[1]/input")).sendKeys(testData);
WebDriverWait wait1 = new WebDriverWait(driver, 10);
wait1.until(ExpectedConditions.visibilityOfElementLocated(By.xpath(".//*[#id='ms-addContract']/div[1]/input"))).sendKeys(Keys.ARROW_DOWN,Keys.ARROW_DOWN,Keys.SPACE);
//Clear the input text value.
driver.findElement(By.xpath(".//*[#id='ms-addContract']/div[1]/input")).clear();---worked but not satisfactory
Please need help to locate the element. I am using keyword driven framework reading values from excel file.
It sounds like you are trying to get all span elements that are contained within a ul element (although correct me if I am wrong). This is the code you are using:
List<WebElement>options = driver.findElements(By.xpath("//ul[#class='ms-list']/li/span[contains(text(),'"+testData+"')]"));
In your case, this XPath will only return 1 value. This is because you are trying to match the contents of each span with an input value "testData". If you want to get all span elements inside of the ul then use:
List<WebElement>options = driver.findElements(By.xpath("//ul[#class='ms-list']/li/span"));
This XPath will select accomplish selecting all span elements in the list. If you need to select only span elements containing text within your testData, then you can iterate over that list selecting the appropriate elements:
ArrayList<WebElement> optionsInTestData = new ArrayList<WebElement>();
for(WebElement element: options){
for(String data: testData){
if(element.getText() == data){
optionsInTestData.add(element);
}
}
}

How to find same element from item grid using loop in java selenium?

I am trying to find button add to cart is present or not using loop from all item box from following code
<div class="page-body">
<div class="product-selectors">
<div class="product-filters-wrapper">
<div class="product-grid">
<div class="item-box">
<div class="item-box">
<div class="item-box">
<div class="item-box">
</div>
in each item box folowing code
<div class="item-box">
<div class="product-item" data-productid="20">
<div class="picture">
<div class="details">
<h2 class="product-title">
<div class="product-rating-box" title="1 review(s)">
<div class="description"> 12x optical zoom; SuperRange Optical Image Stabilizer </div>
<div class="add-info">
<div class="prices">
<div class="buttons">
<input class="button-2 product-box-add-to-cart-button" type="button" onclick="AjaxCart.addproducttocart_catalog('/addproducttocart/catalog/20/1/1 ');return false;" value="Add to cart">
</div>
</div>
</div>
</div>
</div>
I need to find that all itembox have add to cart button present or not using loop. if anyone can help please
I suggest to avoid looping if not necessary. You do not need to do the loop to find out unless there is an explicit need of doing so. You can find the count of Add to cart button and compare with a known value
By byCss = By.cssSelector(".item-box>div input[value='Add to cart']");
int cartCount = driver.findElements(byCss).size();
if (cartCount != 4){
//fail the test
}
If you exactly one to looping and check if the input button exist or not.
By itemBoxes = By.className("item-box");
By button = By.cssSelector("[type='button'][value='Add to cart']");
List<WebElement> webElementList = driver.findElements(itemBoxes);
for (WebElement element: webElementList){
//simply taking size if exist it will return 1
if (element.findElements(button).size() != 1){
//fail
}
}
you can use searching by xpath inside of the loop.
Something like
".//input[#value='Add to cart'][1]"
".//input[#value='Add to cart'][2]"
".//input[#value='Add to cart'][3]"
etc
not sure that this xpath is correct, but generally it will work for you, bro.
Or something like this:
string xpath=".//input[#value='Add to cart']";
var AddToCartBtnsList = driver.findElements(By.Xpath(xpath));
foreach(IWebElement button in AddToCartBtnsList )
{
button.click();
}

How to assign values to HTML fields (e.g. img src="" with scriptlets

What I'm trying to do is to assign the value of a Scriptlet variable as the source for an image.
Here is the HTML in question:
<div class="row">
<div class="tab-content">
<div class="tab-pane active" id="material">
<h2>Material</h2>
<ul class="thumbnails" id="hover-cap-3col">
<div id="myCarousel" class="carousel slide" data-interval="false">
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item">
<%
rs = stmt.executeQuery("SELECT IMG_NAME FROM IMAGES WHERE IMG_NAME LIKE 'Material%'");
ResultSetMetaData rsmd = rs.getMetaData();
int columnCount = rsmd.getColumnCount();
if (rs.next()) {
for (int i = 1; i < columnCount + 1; i++) {
names.add(rs.getString(i));
}
}
for (String name : names) {
String url = "http://localhost:8085/assignment/GetImage?name=" + name;
%>
<a href="http://localhost:8085/assignment/GetImage">
<div class="thumbnail">
<div class="caption"><h4>1</h4></div>
// RIGHT HERE ------> <img src=<%url %> alt="ALT NAME">
<div class="caption-btm"><p>Material A</p></div>
</div></a>
<% } %>
</div>
</div>
At the place where I specify the source for the image (shown by the comment), it gives me the following errors:
Syntax error, insert "AssignmentOperator Expression" to complete
Assignment
Syntax error, insert ";" to complete Statement
Obviously, I can't assign the value to img src="" in that way. Is there any way for me to use the Scriptlet value or should I just scrap it and move on?
In JSP if you want to refer a Java expression in HTLM then you can use <%= expression %>
So it should be
<img src="<%=url %>" alt="ALT NAME">
and not
<img src=<%url %> alt="ALT NAME">
If you want to write the value of an expression to the served page, you must use <%= expr %> construct instead:
<%=url %>
This is called a JSP expression.

Categories