How can I create a button in thymeleaf to act as a link and opens in a new tab with some given parameters?
I tried this one but now works:
<button th:onclick="window.open('https://www.google.com/location/' + ${id})"> GO</button>
It does not work when I'm using variables (${id})
If you aren't using bootstrap, I would represent the button like this.
<button
th:data-url="#{https://www.google.com/location/{id}(id=${id})}"
onclick="window.open(this.getAttribute('data-url'))">GO</button>
Note: I'm using onclick and not th:onclick.
If you are using bootstrap, you can style the link as a button as in the other answer, and just use th:href.
<a class="btn" th:href="#{https://www.google.com/location/{id}(id=${id})}" target="_blank">GO</a>
You can try like below. bootstrap will help your anchor tag look like a button.
<a class="btn" th:href="#{/url/{id}(id=${id})}" target="_blank">GO</a>
Related
I am using clarity signpost, I am using this signpost for showing multiple applications, how to close this sign post when i am click on the application.
For example I am adding three buttons in this sign post, if I click on the button this need to be close. Please check my stackblitz
To keep track of whether the signpost is open or not, and then be able to dynamically close it, you should use the de-sugarized syntax of clrIfOpen to utilize two-way binding:
<ng-template [(clrIfOpen)]="signPost">
<clr-signpost-content>
<button class="btn btn-outline" (click)="close()">Hr</button>
...
</clr-signpost-content>
</ng-template>
Here is your example with this change, working fine: https://stackblitz.com/edit/signpost-dynamic-close?file=src/app/app.component.html
I have this piece of code on my site:
<div class="product-cta">
<span class="price">2.998,-</span>
<div class="btn-wrapper">
<a class="btn btn-primary btn-addtocart btn-xlarge" href="#" data-basket-url="/kassen/kurv/" data-product-id="25984"><i class="icon icon-cart"></i>Add to cart</a>
</div>
Is it possible to extract the numbers that come after data-product-id= to Google Tag Manager without pushing it through datalayer, only using what is in the existing code? This is on a product page and is to be used with the Facebook Pixel.
Yes, you can try couple methods without pushing it to the dataLayer. You could use JS (natively or jQuery) to scrape that info, or you could also use a built-in auto-event variable like this:
If you want to use the AEV, then you would likely be capturing that data on a click or something as the AEVs are "essentially [macros] that can be used to refer to, for example, the DOM element where a click occurred" (cf. https://www.simoahava.com/analytics/auto-event-tracking-google-tag-manager/).
I am writing a selenium script that automates a web-page. I need to click on a button which is defined within a list.
This is the image of my web UI - New Account is the button I am referring to
This is my XML code :
<div id="00B4E000000LQ2C_topNav" class="topNav primaryPalette">
<div id="00B4E000000LQ2C_subNav" class="subNav">
<div class="linkBar brandSecondaryBrd">
<div id="00B4E000000LQ2C_listButtons" class="listButtons">
<ul class="piped">
<li>
<input class="btn" type="button" title="New Account" onclick="navigateToUrl('/setup/ui/recordtypeselect.jsp?ent=Account&ekp=001&retURL=%2F001%3Ffcf%3D00B4E000000LQ2C%26isdtp%3Dnv%26nonce%3Df8007ad94993912b7ff4149193a6096ccfed4ebb1454e0b9b310ad14b61de71d%26sfdcIFrameOrigin%3Dhttps%253A%252F%252Fcs83.salesforce.com&save_new_url=%2F001%2Fe%3FretURL%3D%252F001%253Ffcf%253D00B4E000000LQ2C%2526isdtp%253Dnv%2526nonce%253Df8007ad94993912b7ff4149193a6096ccfed4ebb1454e0b9b310ad14b61de71d%2526sfdcIFrameOrigin%253Dhttps%25253A%25252F%25252Fcs83.salesforce.com&isdtp=vw','LIST_VIEW','new');" name="new" value="New Account"/>
</li>
<li class="lastItem">
</ul>
I used:
driver.findElement(By.xpath(".//*[#id='00B4E000000LQ2C_listButtons']/ul/li[1]/input")).click();
(Xpath was given by the firebug) but it gives me an error stating
unable to locate elements
Please help me script / locate this button.
You don't have to use XPaths generated by the Firebug and check the element's parents along the way. We can do better, you can write a more reliable and a simpler way to locate the element:
driver.findElement(By.name("new"));
or:
driver.findElement(By.cssSelector("input[name=new]"));
or:
driver.findElement(By.cssSelector("input[value='New Account']"));
Note that the XPath expression you have looks valid. You may be experiencing a timing issue and would need to wait for the element presence, visibility or clickability, see: How to wait until an element is present in Selenium?.
And, if the button is inside the iframe, you need to switch to its context and only then search the button:
driver.switchTo().frame("ext-comp-1005");
Hi please try like below
// first way
driver.findElement(By.xpath("//*[#name='new']")).click();
// second way
driver.findElement(By.xpath("//*[#class='btn']")).click();
// basically you can use various attributes of input tag with button inside the xpath to click
Update working with i frame
// A short way to identify how many iframe's are present on a web page
List<WebElement> numberOfFrames= driver.findElements(By.tagName("iframe"));
System.out.println("Total Number of iframes present are : " +numberOfFrames.size());
for(int i=0;i<numberOfFrames.size();i++){
// here u can identify iframes with any of its attribute vale say name,title or which is most suitable.
System.out.println("Name of the i-frames : " + numberOfFrames.get(i).getAttribute("name"));
}
// Back to your question - button lies inside iframe hence
// key here is before clicking you have to switch to the frame first
driver.switchTo().frame(driver.findElement(By.name("frame name")));
hope this helps you
I'm using jQuery UI with a custom theme, and I have an <input type="submit"> element on my page. Since jQuery is around this button gets the jQuery UI look and feel - it is automagically added the css classes ui-button ui-widget ui-state-default.
How do I get rid of these ?
Want the button to be a plain old button without those classes.
Thanks.
The buttons don't automatically get the classes set - you must be calling something like the following
$("button, input:submit, input:button").button();
you need to remove input:submit
To change your button back to 'normal' style you could either use ManseUK's answer, or if you just want to restyle this button you can remove the three classes by adding $("#yourButtonID").removeClass("ui-button ui-widget ui-state-default")
Another way to solve this problem is that if you look in the jquery-ui.js file there will be a block comment that starts with something like: "jQuery-UI Button", delete that entire block from the start of the comment to the start of the next comment for another widget.
This solved the problem for me.
Im using the childbrowser plugin with phonegap and jqtouch.
I have this in a menu list to open webpages:
<a href="#"
onClick="PhoneGap.exec('ChildBrowserCommand.showWebPage','http://
mobile.twitter.com/company');" >
The problem is that the onClick opens the childbrowser as soon as I
touch it, and since I have this in a menulist, I cant scroll the list
up and down without the childbrowser opens.
So how can I change the onClick so it act as a tap instead?
What do I have to do?
Thanks!
What's worked for me is to use jQuery's bind approach and bind a tap event to the element that you'd like to call the Childbrowser. Here's some generic HTML and JavaScript that should give you a sense of what to do:
HTML:
<p class="urlStyle">Your link</p>
JavaScript:
$('p.urlStyle').bind('tap',function() {
window.plugins.childBrowser.showWebPage("http://www.yourlink.com");
});