I tried to click on a button. It has this structure:
<div class="button-wrapper" id="button-verify-wrapper">
<a x-ng-click="verifySfdcConnection()" class="clearfix float-left button-green">
<div class="icon-green icon-green-verify"></div>
<div class="button-label ng-binding">Verify Connection</div>
</a>
<div x-ng-class="{'connection-verified':wizardData.inputSource.sfdc.connectionStatus}" x-ng-show="wizardData.inputSource.sfdc.connectionStatus" style="" class="connection-verified"></div>
</div>
Any help how to do it? I tried this:
driver.findElement(By.xpath(".//*[#id='button-verify-wrapper']/a/div[1]")).click();
But it doesn't help.
Thanks
I think <a> element is clickable here. You should try to locate <a> element instead and perform click() action as below :-
using By.cssSelector() :-
driver.findElement(By.cssSelector("div#button-verify-wrapper > a")).click();
using By.linkText() :-
driver.findElement(By.linkText("Verify Connection")).click();
using By.xpath() :-
driver.findElement(By.xpath(".//a[normalize-space(.) = 'Verify Connection']")).click();
If you're still unable to perform click, try as an alternate solution using JavascriptExecutor as below :-
((JavascriptExecutor)driver).executeScript("arguments[0].click()", driver.findElement(By.cssSelector("div#button-verify-wrapper > a")));
You should click on the link using a css selector like:
a[x-ng-click*='verifySfdcConnection']
driver.findElement(By.id("button-verify-wrapper")).click();
Note: 1. if ID or class name is directly given no need to use xpath, can directly use By.id and By.class
2. To perform an action on web element we should know the properties of that element ex. if it is not a button you can not perform click on it
try this: $("#button-verify-wrapper > a").click()
Related
I'm trying to fetch the text of a span that has a given class -> closest to the click via Google Tag Manager. Is it possible via plain JS or JQuery?
The code looks like this:
<a class="contenttile" href="/mypage" style="height: 193px;">
<div class="imageContainer" style="height: 97px;">
<img src="http://http:someadress.com/foto.jpg" class="blurr" alt="">
</div>
<div class="textContainer">
<span class="text3">My text</span>
<br>
</div>
</a>
What I want to return via a function is My text.
I was trying different snippets found here, but since im a JS lame I couldn't adjust it to work properly.
For example this one:
function(){
var ec = {{Click Element}};
var x = $(ec).closest('span');
return x.innerText;
}
since you are using jQuery
return ec.find('.text3').text();
In GTM, your click may register two events: gtm.click and gtm.linkClick. Depending on which one your tag is set to fire on (ie. you can set it to fire on all clicks or just links), then you could use either of the following:
If using just links, then $(ce).find('.textContainer').find('span').text()
If using all clicks, then $(ce).closest('span').text()
Is it possible to make a submit button that when I click it, it will get me to the for example <div id="Home"> without Javascript? I already tried with different ways but as always the first page is showing all tags from other ID's page's. I already have the Javascript code but I don't want to use, I want to do all this by simple HTML tags, if possible please help.
Instead of
<button type="submit">Submit</button>
why not do something like
submit
Give your div an id such as
<div id="#home">
and then the link should link to the #home.
<a href="#home">
That should work
Try it here
https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_a_href_anchor
I want to display the href link in the <div id="display"></div> tag so when I press anything in the menu or in my list it'll just open in the div with display as its id.
I have this menu like this done
<div class="menu">
HOME
</div>
<div id="display"></div>
and my JavaScript is like this
$('#display').html($('.menu a').html());
I don't know much about javascript, but I think the javascript code is actually wrong, I would appreciate is someone would help me.
I want to display the href
You need to fetch href property for that you can use .prop()
$('#display').html($('.menu a').prop('href'));
Demo
In case you mean retrieve the page and place it in the div:
// bind click event to all anchors within .menu
$('.menu a').click(function(e){
// fetch the page using AJAX and place the results in #display
$('#display').load(this.href);
// prevent navigating away from the page (default action of anchor)
e.preventDefault();
});
(Or maybe it's just me, but the question seems very hard to understand. :shrug:)
$('.menu a').on('click',function(e){
e.preventDefault(); //this will keep your link from loading
var href = $(e.currentTarget()).attr('href');
$('#display').html(href);
});
We can use an iframe to display the link in the <a> tag.
Here's a fiddle
Here is my version...
HTML
<div class="menu">
<a id="xxx" href="http://stackoverflow.com" onkeydown="myFunc()">HOME</a>
</div>
<div id="display"></div>
JS
$(document).ready(function() {
var data = $("a#xxx").attr("href");
$('#display').html(data);
});
Here is the code I have:
$('#link').attr("href",link)
$('#link').text(text)
How do I change the title of a link using jQuery? I'm correctly changing the url, but I can't edit the text, what am I doing wrong?
<a id="link" href="" target="_blank">text</a>
$('#link').attr("href",data[1].url)
$('#link').attr("title",data[1].title)
title
I'm tring to simply change 2 things:
url
title (as show above)
I'm able to change the link, but the title won't change. I'm selecting the wrong trhing. Therefor is there a way to list all attr available to me? Or are you able to help me change the text title above?
Either answer is acceptable.
<div id="highlight" class="topicHighlight hero1">
<h3 id="h3">hero_1_large_text</h3>
<p id="p"></p>
<span id="coverTextSpan">hero_1_small_text</span>
<a id="link" href="url" target="_blank">text</a>
</div>
use html function:
$('#link').html(text);
or , if you are talking about the title attribute:
$('#link').attr('title','some title');
I think you need to use the HTML() method to change the content of the anchor tag.
Here is the link to the documentation.
you can try this javascript only.
document.getElementById('link').innerHTML = "new title";
i think this will surly helpful to you..
Thanks.
If all these answers don't work for you then you should check:
What element are you selecting and see if it's the correct one
What variable are you assigning to the title(data[1].title)
I recommend using firebug in firefox or using the dev console in google chrome, anduse the console.log() function to log things so that you don't have to alert() them all the time.
I want to insert an opening div but it closes itself automatically. How do I get this to work.
I want to wrap thses two divs in one div called controls...
<div class="carousel-prev prev-next"></div>
<div class="carousel-next prev-next"></div>
So I get...
<div id="controls">
<div class="carousel-prev"></div>
<div class="carousel-next"></div>
</div>
I did try:
$(".jcarousel-prev").before("<div id='controls'>");
But as I mentioned above, it closes automatically.
$(".prev-next").wrapAll("<div id='controls'>");
in your particular case you're removing class too i.e.
$(".prev-next").removeClass('prev-next').wrapAll("<div id='controls'>");
You can use .wrapAll():
$(".prev-next).wrapAll('<div />');
You should use wrap function to achieve that:
http://api.jquery.com/wrap/
try this...
$(".prev-next").appendTo("<div id='controls'>");