there is text label on a webpage, and I am trying to click on that to open a pop-up window,but not getting opened. here is the HTML code:
<td width="40%">
<div id="EmpId.outline">
<input type="hidden" name="EmpId" value="" id="popupEmpId">
<input type="text" name="EmpCode" value="" readonly="readonly" class="textMedium250" id="popupEmpCode" autocomplete="off"> <label onclick="checkForPopup('EmpPopupDiv','Select a Emp',640,true,refreshConditionOptions);"> + Search for a Emp</label>
</div>
</td>
I have to click on the label + Search for a Emp, but could not do that.
Try to find element by xpath and click. Based on your example, the xpath to find/click should be something like this:
"//a[#href='#f2']"
<td width="40%">
<div id="EmpId.outline">
<input type="hidden" name="EmpId" value="" id="popupEmpId">
<input type="text" name="EmpCode" value="" readonly="readonly" class="textMedium250" id="popupEmpCode" autocomplete="off"> <label > + Search for a Emp</label>
</div>
</td>
Related
I need to write xpath for 'New' button.
have tried:-
By.xpath("//form[#action='/intruvert/action/CustomRolesAction']/div/div[3]/div/a[1]")
By.xpath("//form[#name='CustomRolesForm']/div/div[3]/div/a[#style='background-color: rgb(242, 242, 242);' and #title='New']")
By.xpath("//form[#name='CustomRolesForm']/div/div[3]/div/a[#title='New']")
but not able to click on New button.
I am not sure here if i missing anything.
kindly suggest.
here is the code:-
<html>
<head>
<body>
<div class="bodywrap">
<form action="/intruvert/action/CustomRolesAction" method="post" name="CustomRolesForm">
<input type="hidden" value="CustomRolesDetails_t" name="userAction"/>
<input type="hidden" value="fullaccess" name="accessRight"/>
<input type="hidden" value="" name="uuid"/>
<input type="hidden" value="true" name="fromTab"/>
<input type="hidden" value="" name="selectedDomain"/>
<input type="hidden" value="/My Company:0/Manager:0" name="resourceName"/>
<input type="hidden" value="MANAGER" name="topMenuName"/>
<input type="hidden" value="Users and Roles" name="secondMenuName"/>
<input type="hidden" value="Roles" name="thirdMenuName"/>
<input type="hidden" value="/My Company:0" name="domainName"/>
<input type="hidden" value="/My Company:0" name="currentDomainName"/>
<input type="hidden" value="/Manager:0" name="shortResourceName"/>
<input type="hidden" value="false" name="ucaplModeEnabled"/>
<table width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
<div class="gensecholder clearfix">
<div class="gensecheader clearfix">
<div class="gensecbody pad10all clearfix">
<div class="gensecfooter clearfix">
<div class="gensecfootright">
<a class="genericbtn" title="New" href="javascript:doSubmit('add')">New</a>
</div>
#Pranay after viewing your code, i got javascript error. inside your html you have not defined anywhere to javascript. see the image
Your html
<a class="genericbtn" title="New" href="javascript:doSubmit('add')">New</a>
Modified html
<a class="genericbtn" title="New" href="#">New</a>
Now use xpath method using javascript executor.
WebElement new_button = driver.findElement(By.xpath("//a[contains(text(), 'New')]"));
((JavascriptExecutor) driver).executeScript("arguments[0].click();", new_button);
OR
driver.findElement(By.xpath("//a[contains(text(), 'New')]")).click();
You can try to locate the button directly without ancestors
// by class name
By.className("genericbtn")
// by title
By.cssSelector("[title='New']")
// by partial href
By.cssSelector("[href*='add']")
//a[.="New"]
Just use text find a tag.
. means current context node(a).
You can just use either title or text property to find out the required link:
By.xpath("//a[#title='New']");
Or
By.linkText("New");
Or
By.xpath("//a[text()='New']");
I have the following checkboxes in view
<div class="form-group">
<label class="col-md-4 control-label">Roles</label>
<div class="col-md-6 col-md-offset-4">
<div class="checkbox">
<label>
<input type="checkbox" name="data_entry"> Data Entry <br />
<input type="checkbox" name="save_on_ext_hd"> Save On External HD <br />
<input type="checkbox" name="print"> Print <br />
<input type="checkbox" name="export_csv">Export CSV <br />
<input type="checkbox" name="delete"> Delete
</label>
</div>
</div>
</div>
I am using laravel 5 and blade template.
the issue is: when click on any checkbox the first one checked and verse versa
Ex: when click pn print checkbox the data_entry checked automatically and when unchecked print data_entry unchecked.
also when check print data_entry checked and when check delete for example data_entry unchecked.
That's because all your checkboxes are inside one <label>. Labels with an input inside activate the input when clicked. So clicking anywhere inside the label will trigger all checkboxes.
Solve this by giving each its own <label>:
<label>
<input type="checkbox" name="data_entry"> Data Entry <br />
</label>
<label>
<input type="checkbox" name="save_on_ext_hd"> Save On External HD<br />
</label>
<!-- etc -->
Context
I'm building a list a results where each result can be edited by users.
Approach
Currently I'm repeating the visible <span> tag that displays a result as well as the hidden <input> tag used to edit this same result. See the last <td> :
<tr ng-repeat="entry in paginateDict | orderBy:predicate:reverse" class="form-inline" role="form">
<!-- Edit buttons -->
<td>
<div class="radio">
<label ng-hide="editMode" title="edit">
<input class="sr-only" type="radio" name="edit"
data-ng-click="editMode=true">
<span tooltip="edit" class="fa fa-pencil fa-lg"></span>
</label>
<label ng-show="editMode" title="save">
<input class="sr-only" type="radio" name="edit"
ng-model="editMode" ng-click="submitEntry(true)">
<span tooltip="save" class="fa fa-save fa-lg text-primary"></span>
</label>
<label ng-show="editMode" title="cancel">
<input class="sr-only" type="radio" name="edit"
ng-model="editMode" ng-click="submitEntry(false)">
<span tooltip="undo" class="fa fa-times fa-lg text-danger"></span>
</label>
</div>
</td>
<!-- Content -->
<td ng-show="pyn" lang="cmn-py" data-id="{{entry.cid}}">
<span ng-hide="editMode">{{entry.pyn | pinyin }}</span>
<input type="text" placeholder="{{entry.pyn}}" ng-model="entry.pyn" ng-show="editMode" class="form-control">
</td>
</tr>
Each line as 5 editable columns and each column as two binding (on <span> and <input>).
Question
In order to improve page performance, by reducing the number of binding, is there an Angular way to dynamically create and attach the <input> to a row when the edit radio button is click ?
You can do that using ngIf directive instead of ng-show
The ngIf directive removes or recreates a portion of the DOM tree based on an {expression}.
<td ng-show="pyn" lang="cmn-py" data-id="{{entry.cid}}">
<span ng-hide="editMode">{{entry.pyn | pinyin }}</span>
<input type="text" placeholder="{{entry.pyn}}" ng-model="entry.pyn" ng-if="editMode" class="form-control">
</td>
I am using validationEngine for validating form fields. I have tab and inside the tab, I have two accordions. Each accordion has 4 fields. When I submit, only first accordion form fields that are opened are getting validated. Is there any way I can force to validate all the form fields and open all accordions to show the required field message? Thank you!
<div id="tabs-1">
<div id="accordion">
<h3>Select Agent</h3> <!-- First accordion title) -->
<fieldset>
<div>
<label >Agent Name or ID</label>
<input name="insuredFirsName" title="type "Agent name or id "" class="validate[required] text-input" type="text" >
</div>
<label>Age</label>
<input type="text" name="age" value="${ajaxForm.age}" maxlength="3" size="3" class="validate[required] text-input" >
</fieldset>
<h3>Application Details</h3> <!-- Second accordion title) -->
<fieldset>
<div>
<label>Contract State</label>
<select name="State" id="State" class="validate[required]">
<option value="">Choose a State</option>
<option value="IL">Illinois</option>
<option value="MN">Minnesota</option>
<option value="WI">Wisconsin</option>
</select>
</div>
<div>
<label>Application Number :</label>
<input value="" class="validate[required] text-input" type="text" name="req" id="req" />
</div>
<div>
<label>Application Number :</label>
<input value="" class="validate[required] text-input" type="text" name="req1" id="req1" />
</div>
</fieldset>
</div> <!-- Accordion close -->
<html:button property="button1" value ="Submit"></html:button>
</div> <!-- Tab-1 close -->
maybe a little late but I had this same problem, i searched on the internet and found a solution, but this will work for you:
jQuery("#digitale-aanvraag").validationEngine({
validateNonVisibleFields: true,
});
Your fields in an accordion are set to hidden so as default the validator would skip them.
Be aware that if you use this in a wizard, it won't work, because those fields are also hidden...
Anyway, GL!
I have recently started using bootstrap to create a front end to a website. I was using chrome to develop it originally. I recently started testing on firefox and I ran into a problem. I have a few radio buttons on the front page. When I click on the one I want it looks as if it is only selecting the first one and not the one I am clicking on. If I click quickly a few times it makes the selection properly. Any ideas why this is happening? The code is here :
<form action="redirector.php" action="get">
<fieldset>
<table border="1">
<tr>
<td valign="top"><b>Please select a genome:</b><br>
<label class="radio">
<input type="radio" name ="genome" value="Acral2">Acremonium Alcalophilum<br><input type="radio" name ="genome" value="Aspni3">Aspergillus niger<br><input type="radio" name ="genome" value="Glotr1_1">Gloeophyllum trabeum<br><input type="radio" name ="genome" value="Phchr1">Phanerochaete chrysosporium<br><input type="radio" name ="genome" value="PleosPC15_2">Pleurotus ostreatus<br><input type="radio" name ="genome" value="Spoth2">Sporotrichum Thermophile<br><input type="radio" name ="genome" value="Thite2">Thielavia terrestris<br> </label>
</td>
<td valign="top">
<b>View proteins with JGI annotation of type:</b><br>
<label class="radio">
<input type="radio" name ="jgiAnnotation" value=sigPInformationView>SignalP Information<br>
<input type="radio" name ="jgiAnnotation" value=ecInformationView>EC and Pathway Information<br>
<input type="radio" name ="jgiAnnotation" value=domainInformationView>Domain Information<br>
<input type="radio" name ="jgiAnnotation" value=goInformationView>Go Information<br>
</label>
<button type="submit" class="btn">Submit</button>
</fieldset>
</form>
</td>
<td valign="top">
<form action="annotationInfoView.php" action="get">
<fieldset>
<b>View single protein:</b><br>
Enter our ID number:<input type="text" name ="ourId"><br>
(i.e. jgi_Spoth2_2293939)<br>
<button type="submit" class="btn">Submit</button>
</fieldset>
</form>
</td>
</tr>
</table>
http://jsfiddle.net/CTF2s/
The problem is you have multiple radio buttons inside of a single label.
If I click quickly a few times it makes the selection properly.
This is probably because you're clicking directly on the radio button and not the text next to the radio button. This is how all browsers will behave, including Chrome.
Check out the "Checkboxes and radios" section of Twitter Bootstrap's "Forms" documentation for a working example.