I'm using IBM http://www.ibm.com/jsf/html_extended custom components in two different pages, one of them displays date picker in a stylish way like the left photo photo1 and it's code
<tr>
<td width="20%">To Date:
<FONT id="toDtColor" color="red" style="display:inline">*</FONT>
</td>
<td width="30%">
<h:inputText id="textSearchToDate1" value="#{SearchTransactionView.searchToDate}" styleClass="mediumInput" disabled="false" readonly="false">
<hx:convertDateTime timeZone="#{BaseBean.defaultTimeZone}" pattern="EEE, dd MMM yyyy" />
<hx:inputHelperDatePicker id="datePicker1" />
<hx:inputHelperAssist errorClass="inputText_Error" id="assist1" />
</h:inputText><br/>
<h:message for="textSearchToDate1" styleClass="fieldError"></h:message>
</td>
</tr>
Then I used this code again in another page,but I found the result like the right photo in photo1 link above.
and the code is
<tr>
<td width="20%" valign="top">User Expiration Date:</td>
<td width="30%">
<h:inputText id="UserExpirationDate" value="#{AddUserView.userExpiryDate}" styleClass="mediumInput">
<hx:convertDateTime timeZone="#{BaseBean.defaultTimeZone}" pattern="EEE, dd MMM yyyy" />
<hx:inputHelperDatePicker id="datePicker100" />
</h:inputText>
<br/>
<h:message for="UserExpirationDate" styleClass="fieldError"></h:message>
</td>
</tr>
So what is the problem of using this component?
The second code fails to specify a font explicitly unlike the first snippet which appears to be causing the font in the second photo to be improperly sized.
Related
I want to override in a ViewModel the way is showed a picture.
According to the DevelopmentView:
Picture for foto2
<div ng-show="ViewModelRoot.VM_Status.vmEditAlumno_foto2_Visible">
<table>
<thead>
</thead><tbody>
<tr>
<img ng-src="{{StreamingViewModelClient.GetVMImageUrl(ViewModelRoot.Curr_vmEditAlumno(), "foto2")}}" img-responsive class="vmImage" />
</tr><tr>
<input type="file" onchange="angular.element(this).scope().onFileSelect('vmEditAlumno.foto2', angular.element(this).scope().ViewModelRoot.Curr_vmEditAlumno().VMClassId)" id="vmEditAlumno.foto2" ng-show="ViewModelRoot.VM_Status.vmEditAlumno_foto2_Enabled" />
</tr>
</tbody>
</table>
</div>
I set "Content Override" in the column and create a AngularUIOverride tag with value "Foto2Alumno.cshtml".
Not it gets the new file "Foto2Alumno.cshtml", as if I change something in that file it is showed, but the picture from the command GetVMImageUrl
isn't show
What am I missing?
Thanks
It was a problem with double quotes ("). I changed them to single quote (') and now the image is shown.
Wrong:
GetVMImageUrl(ViewModelRoot.Curr_vmEditAlumno(), "foto2")
Right:
GetVMImageUrl(ViewModelRoot.Curr_vmEditAlumno(), 'foto2')
im a new bee of protractor .
here is the code:
// fist line
<table class="table">
<tbody class="table-body">
<tr class="table-tree" ng-repeat="items in page">
<td class="checkbox" >
<input type="checkbox">
<td class="node-name">
<span class="node-icon" title="tree">
// second line
<tr class="table-tree" ng-repeat="items in page">
<td class="checkbox" >
<input type="checkbox">
<td class="node-name">
<span class="node-icon" title="flower">
// third line
<tr class="table-tree" ng-repeat="items in page">
<td class="checkbox" >
<input type="checkbox">
<td class="node-name">
<span class="node-icon" title="flower">
</tbody>
</table>
Im want to click the sencond checkbox , and the first line is not always present, so i cant use $$('.checkbox').get(1) to get it, so I trying to locate the first checkbox where has [title = "flower"], then I write this:
var a = $$('[title="flower"]').get(0).getWebElement();
var b = a.getDriver().findElement(by.css('.checkbox'));
b.click();
but when the process finish , the first line checkbox was be click,
whats the wrong? and how can I fix it?
try $$('[title="flower"]').get(0).$('.checkbox').click()
First of all: why do you use .getWebElement() and .getDriver()?
What is you error message?
#Vlad's solution would be ok, but checkbox is not an ancestor of flower.
You need to get tr, check whether it contains title="flower" and if so, click checkbox of tr.
I won't write code for you, but you can check my answer: https://stackoverflow.com/a/48020146/6331748 and adjust code for your needs.
Option 1) Use XPath
element(by.xpath('//tr[td/span[#title="flower"]]/td[1]/input')).click();
Option 2) Use element() chain
// find the `SPAN` which title is flowser <br>
element(by.css('span[title="flower"]')) <br>
// find parent of `SPAN` until `TR` <br>
.element(by.xpath('./../..')) <br>
// find the `input` inside the first `TD` of above `TR` <br>
.element(by.xpath('./td[1]/input'))
I'm a beginner and I'm trying to write a Selenium web driver. I'm using eclipse and trying to locate a link available in next column. In each row I have different link. For example in my employee data table I have 2 columns and 10 rows in one page. The first column contains the name of person and second column contains its employee ID (ID is a hyperlink). I'm trying to select the hyperlink of any employee but I'm not able to do it.
I have below the HTML code and sample script.
<span id="37">
<div class="clear"></div>
<div id="FC_Schema.1021.WIP" type="DataCheckingList" name="FC_Schema.1021.WIP">
<input id="baseurl" type="hidden" value="/Web/" name="baseurl">
<input id="hdnDcCnt" type="hidden" value="13" name="hdnDcCnt">
<input id="PageNo" type="hidden" value="1" name="PageNo">
<meta content="width=device-width" name="viewport">
<style type="text/css">
<div id="DataCheckingLoad">
<div id="SupplyChainTabs">
<div id="gbo" class="InnerAlertsTabs">
<table id="one" class="draggable" width="100%">
<thead>
<tbody>
<tr>
<td valign="top" align="center">
<td valign="top">
<td valign="top">
<a onclick="return ButtonClick(this,'TxnyD.Communities.2.1','Org.2000476_Product.THQS|SMS|Questionnaire.WIP_Questionnaire_TxnyD.Communities.2.1_THQS_TxnyD.Operationaloffice.1.2');" href="#f">Axiom
Process LLC</a>
<div class="country-name">
<div class="CompanyInfoContactLinks">
</td>
<td valign="top">
THQS
<div class="clear"> </div>
<a id="Org.2000476_Product.THQS|SMS|Questionnaire.WIP_Questionnaire_TxnyD.Communities.2.1_THQS_TxnyD.Operationaloffice.1.2" onclick="RedirectToQuestionnairePage(id)" href="#">THQS</a>
<div class="clear"> </div>
</td>
In the above code first column contains company name i.e "Axiom
Process LLC" and second column contains company subcription name i.e."THQS". I have to select the THQS link of company "Axiom Process LLC"
Selenium script designed for it as below
public static void main(String[] args) throws Exception {
WebDriver driver = new FirefoxDriver();
driver.manage().window().maximize();
driver.get("http://XXX.XXX.XXX.XXX/Web");
Thread.sleep(1000);
driver.findElement(By.xpath("//input[#id='UserName']")).sendKeys("Gbouser.1");
driver.findElement(By.xpath("//input[#id='Password']")).sendKeys("****");
driver.findElement(By.xpath("//input[#name='Login']")).click();
driver.findElement(By.xpath("//a[contains(text(),'Task')]")).click();
driver.findElement(By.xpath("//a[contains(text(),'Data Checking')]")).click();
driver.findElement(By.partialLinkText("Axiom")).findElement(By.xpath("//a[contains(text(),'THQS')]")).click();
}
So basically these are dynamic tables and each time it will have different records. How can select the link available in column?
I also tried below script as well:
driver.findElement(By.name("*[id^='CLS'][id$='Demolition Limited']")).findElement(By.xpath("//a[contains(text(),'THQS')])[3]")).click();
welcome to Stackoverflow. Before answering your question, just a few pointers. Think that you had a downvote 'cause you didn't format your question well. Otherwise a perfectly legal question, and you would receive help much earlier.
Secondly, don't ever put the real Web site address, username and password :). I was able to login, and understand exactly what you need, but a malicious guy could do bad wonders there.
To answer your question, instead of the line that is causing you problems, try this
Thread.sleep(3000);
TablePageObject tablePageObject = PageFactory.initElements(driver, TablePageObject.class);
tablePageObject.clickLink("Axiom");
Where TablePageObject is
public class TablePageObject {
private WebDriver driver;
#FindBy(css = "table tr")
private List<WebElement> allTableRows; // find all the rows of the table
public TablePageObject(WebDriver driver) {
this.driver = driver;
}
public void clickLink(String companyName) {
for(WebElement row : allTableRows) {
List<WebElement> links = row.findElements(By.cssSelector("a"));
// the first link by row is the company name, the second is link to be clicked
if (links.get(0).getText().contains(companyName)) {
links.get(3).click();
}
}
}
}
An explanation, TablePageObject class will be your programmatic handle for the dynamic table you're trying to control. It follows a page factory pattern of selenium, which I heartly recommend, and you can learn more here https://code.google.com/p/selenium/wiki/PageFactory
It basically keeps a collection of rows of your table, which more or less looks like:
<tr>
<td valign="top" align="center">
// irelevant
</td>
<td valign="top">
// irelevant
</td>
<td valign="top">
<a>Axiom Process LLC</a>
<a>company details</a>
<a>web details</a>
</td>
<td valign="top">
<a>THQS</a>
</td>
<td valign="top" align="center" style="display: none">
// irelevant
</td>
<td valign="top">
//irelevant
</td>
<td valign="top">
// irelevant
</td>
<td valign="top">
</td>
<td>
</td>
</tr>
You collect all the links from the table, check the company name against the first link, and if matched, click the fourth link,
Hope it helps, best,
by the way, I've masked your password in the question
Given this table structure:
<table id="tblBranchDetails">
<tr>
<td width="120px">Branch:</td>
<td id="branchName" class="branchData">
<label id="lblBranchName"></label>
<input type="text" id="txtBranchName" class="hideOnLoad editBranchInfo" />
</td>
</tr>
<tr>
<td>Address Line 1:</td>
<td id="branchAddress1" class="branchData">
<label id="lblAddress1"></label>
<input type="text" id="txtAddress1" class="hideOnLoad editBranchInfo" />
</td>
</tr>...
I'm trying to select the label and input in each td so I can clear the label's text and hide the input.
This gives me the text in the label (verified in the console):
$('table#tblBranchDetails tr td:nth-child(2):eq(0)').text();
So I know I can clear the label's text with ".text('')"
Having figured that out, I thought this would give me the value of the input:
$('table#tblBranchDetails tr td:nth-child(2):eq(1)').val()
But it gives me the value of the label in the next td. So obviously I'm using the :nth-child() and :eq() functions wrong.
What's the correct way to do what I'm trying to do?
I was nuking this.
Here's the solution:
$('#btnShowBranchEditBoxes').click(function() {
$('#tblBranchDetails tr').find('label').fadeOut(200);
$('#tblBranchDetails tr').find('.editBranchInfo').delay(200).fadeIn(200);
// Replace the buttons
$('table#tblBranchDetails input#btnShowBranchEditBoxes').fadeOut(200);
$('table#tblBranchDetails input.btnEditBranch').delay(200).fadeIn(200);
});
It takes certain height for column or say row when we use which we are not able to remove
pls find code for more info
<td><s:form id="formAutocomplete" action="gridVisualisation"
theme="simple" target="grid123">
<table>
<tr>
<td><s:select id="selectedProfile" name="selectedProfile"
list="profileList" theme="simple"></s:select></td>
<td><sj:autocompleter id="selectedKeyword"
name="selectedKeyword" list="%{keywords}" loadMinimumCount="2"
label="Search" /> <s:hidden id="hiddenField" value=""
name="selectedProfile"></s:hidden> <s:hidden id="StartValueX"
value="" name="StartValueX"></s:hidden> <s:hidden id="EndValueX"
value="" name="EndValueX"></s:hidden> <s:hidden id="DurationType"
value="" name="DurationType"></s:hidden></td>
<td><sj:submit targets="grid123" value="AJAX Submit"
timeout="2500" parentTheme="simple" indicator="indicator"
onBeforeTopics="before" onCompleteTopics="complete"
onErrorTopics="errorState" effect="highlight"
effectOptions="{ color : '#222222' }" effectDuration="3000"
onclick="javascript:setXYGraphVal();" /></td>
</tr>
</table>
</s:form></td>