Can someone please help me. I'm trying to select an option from the drop down list using selenium IDE but not able to. Below is the HTML.I tried to use "Select"Command with xpath in target but not able to select from the options
<select id="age" class="default chzn-done"onfocus="javascript:setOmnitureFallout('birthdate');"name="ctl00$ContentPlaceHolder1$age" style="display: block; visibility: hidden;" tabindex="21">
<option value="0">0 - 11 months</option>
<option value="1">1 year</option>
<option value="2">2 years</option>
<option value="3">3 years</option>
</select>
<div id="age_chzn" class="chzn-container chzn-container-single chzn-container-active" style="width: 200px;" tabindex="21">
<a class="chzn-single" tabindex="-1">
<span style="background-color: transparent;">2 years</span>
<div>
<b/>
</div>
</a>
<div class="chzn-drop" style="left: -9000px; width: 198px; top: 41px;">
<div class="chzn-search" style="">
<ul class="chzn-results">
<li id="age_chzn_o_0" class="active-result" style="">Select one</li>
<li id="age_chzn_o_1" class="active-result" style="">0 - 11 months</li>
<li id="age_chzn_o_2" class="active-result" style="">1 year</li>
<li id="age_chzn_o_3" class="active-result result-selected" style="">2 years</li>
<li id="age_chzn_o_4" class="active-result" style="">3 years</li>
</ul>
This is how I would use a 'select' command in general:
Using select command
For the select element locator I would usually use it's xpath and for the option locator I would use label which can be specified as a regex. For example:
label=regexp:^This_Matches_the_Option_I_want_to_Select$
Hope this helps.
We can give you a more specific answer if you post the html code snipet of the page you are working on and the code you have already written.
Let me know in case you have any questions.
Related
Say I have the following:
<div class="data">
<h2 class="entry-contentH2">Preparation</h2>
<h2>Airplanes</h2>
<ul>
<li><strong>3 large</strong> wings</li>
<li><strong>2</strong>doors</li>
</ul>
<h2>Car</h2>
<ul>
<li><strong>4</strong> doors</li>
<li><strong>1 cup</strong> holder</li>
</ul>
<h2 class="stopHeader">Execution</h2>
<h2>Motorcycles</h2>
<ul>
<li>Easy to learn</li>
</ul>
</div>
I'm trying to get query all of the <p></p> tags text after the <h2>Preparing</h2>, but I want it to stop at the last <p></p> before the stopHeader class.
This is the code that I came up with:
//h2[contains(.,"Preparation")]/following-sibling::h2/text()[not(preceding::h2[#class="stopHeader"])]
#and also
//h2[contains(.,"Preparation")]/following-sibling::h2/text()[not(preceding::h2[contains(., "Execution")])]
Try below XPath to get desired output:
//h2[.="Preparation"]/following-sibling::h2[./following-sibling::h2[.="Execution"]]/text()
This should return text content of each header (h2) between "Preparation" and "Execution"
Try this xpath.
//h2[text()='Preparation']/following::h2[not(#class='stopHeader')]/text()
HTML:
<div id="my-id">
<li class="list_element">
<div class="my_class"></div>
</li>
<li class="list_element">
<div class="another_class"></div>
</li>
<li class="list_element">
<div class="class3"></div>
</li>
</div>
What I want to do with behat/mink:
$page = $this->getSession()->getPage();
$selector = $page->find('css', "#my-id .my_class"); //here I need anchor element located near to .my_class div.
I don't know in which one .list_element .my_class div is. I know only anchor is next to .my_class element. Which selector should I use in the find() function?
Try one of these:
#my-id .my_class ~ a
#my-id .my_class + p
#my-id .list_element a
This is too basic question.Please see more here w3schools
When I use Summernote and jQuery UI Sortable, I can sort items but cannot input text into the textareas. How can I accomplish it?
HTML
<ul class="sortable-list">
<li>
<h2>Textarea 1</h2>
<textarea name="textarea_1" id="textarea_1" class="summernote">
</textarea>
</li>
<li>
<h2>Textarea 2</h2>
<textarea name="textarea_2" id="textarea_2" class="summernote">
</textarea>
</li>
<li>
<h2>Textarea 3</h2>
<textarea name="textarea_3" id="textarea_3" class="summernote">
</textarea>
</li>
</ul>
JavaScript
$('.summernote').summernote();
$('.sortable-list').sortable({
axis: 'y'
}).disableSelection();
Please see also jsfiddle:
http://jsfiddle.net/L4pq1fad/
I got the answer in GitHub issue.
https://github.com/summernote/summernote/issues/1174#issuecomment-115235983
The JS should be:
$('.summernote').summernote();
$('.sortable-list').sortable({
handle: "h2",
axis: 'y'
});
sanchezzzhak created jsfiddle: http://jsfiddle.net/sanchezzzhak/L4pq1fad/3/
dunno whats going on with my image slider under the 'support' tab section its not showing up correctly, its cutting half of it off and looking weird. The main image slider is good. But, when you inspect element all of a sudden the 'support' orbital image slider looks normal. This is with the foundation framework.
here's a link to see the bug:
http://www.omegadesignla.com/virtual/
and some html:
<div class="content" id="panel6">
<div class="row">
<div class="large-4 columns">
<h3> OFLVS Contact Info:</h3>
<ul>
<li>Student Support</li>
<li>Parent Support</li>
<li>Support links and resources</li>
</ul>
</div>
<div class="large-8 columns">
<ul class="example-orbit" data-orbit>
<li>
<img src="imgs/flash3.jpg" alt="slide 1" />
<div class="orbit-caption">
Caption One.
</div>
</li>
<li>
<img src="imgs/flash12.jpg" alt="slide 2" />
<div class="orbit-caption">
Caption Two.
</div>
</li>
<li>
<img src="imgs/flash9.jpg" alt="slide 3" />
<div class="orbit-caption">
Caption Three.
</div>
</li>
</ul>
</div>
</div>
Learn More
Sign Up
</div>
javascript:
$(document).foundation({
tab: {
callback : function (tab) {
$(document).foundation('reflow');
}
},
orbit: {
pause_on_hover: false,
timer_speed: 6000
}
});
I think your error stems from the fact that the orbit slider is in the tab content section. I had a similar error with a range slider in a tab section.
Try reflowing the javascript in a JS file with a tab callback like so:
$(document).foundation({
tab: {
callback : function (tab) {
$(document).foundation('orbit', 'reflow');
}
}
});
EDIT: I've corrected my answer and added a working fiddle.
I bind list of data to HTML, in each list has button for get details by ajax. I want to bind callback data to member of model, After ajax call back, object have data, view received ( ko.toJSON(d, null, 2))object. But HTML doesn't update data.
I don't know what is wrong. please help. Thank you.
Html:
<section id="lists">
<article class="todoList">
<script type="text/html" id="person-template">
<!-- <p>Credits: <span data-bind="text: message"></span></p>-->
<p>xxx</p>
</script>
<ul data-bind="foreach: Items">
<li>
<div>
<span class="contentarea" data-bind="text: message"></span>
<button data-bind="click: $parent.evClick.bind($data)">Get details</button>
<button data-bind="click: detail">Ajax-Get</button>
<p>Credits: <span data-bind="text: d.message"></span></p>
<div style="display: block; width: 200px; height: 200px; border: solid 1px #ff6a00;" data-bind="text: ko.toJSON(d, null, 2)"></div>
</div>
</li>
</ul>
</article>
</section>
Full code here.
http://jsfiddle.net/wuttipat/sc8fX/12/
You should use
<div data-bind="with: d">
<span data-bind="text: message"></span>
Because data-bind="with: d" create scope for binding context when you use data-bind="text: message" inside it will reference to parent binding context in this case mean d.
Full code here : http://jsfiddle.net/sc8fX/74/
I think I've figured it out (after cleaning up the fiddle some more). You're binding is
text: d.message
But it should be
text: message
Because d is the context of your binding. So you're actually trying to bind to d.d.message which doesn't exist. Replacing it with text: message seemed to work, no?
See this updated fiddle.
I found the issue posted on knockout document.
http://knockoutjs.com/documentation/with-binding.html