I don't know how to concatenate
<button type="button" data-toggle="modal" data-target="#modal_form_inline"> Bloqué</button>
and
th:text="${z.idp}"
I wanna to concatenate th:text="${z.idp}" with data-target="#modal_form_inline"
the result would like next:
modal_form_inline1 or modal_form_inline2
Related
I am dynamically creating a html link and I want to set a onclick event with a parameter. Parameters is variable.
return '<a role="button" href="#" class="btn btn-default btn-sm delete-btn ml-2" onclick="deleteMeeting('+data[1]+')" >Delete</a>'
I am getting an error,
Uncaught SyntaxError: missing ) after argument list.
Currently it render like this,
<a role="button" href="#" class="btn btn-default btn-sm delete-btn ml-2" onclick="deleteMeeting(Junior Technical Author)">Delete</a>
The problem is you are outputing a string directly into a function call without using '. You need to add escaped ' and place your data[1] inside them.
return '<a role="button" href="#" class="btn btn-default btn-sm delete-btn ml-2" onclick="deleteMeeting(\''+data[1]+'\')" >Delete</a>'
This way, you will paste your data[1] inside a string.
I have a case where XPath is not unique and matches 3 elements on the page whose elementary position changes with refresh:
<div class="col-xs-12 Hover">
<button data-testid="continueCheckoutButton" ng-
class="continueDellMetricsClass" ng-click="continueButtonClick()" ng-
disabled="disableContinueButton" class="btn btn-success btn-block
continueButton" data-metrics="" type="button">Checkout</button>
Please help me finding the unique XPath or CSS path of this button element.
The other two HTML is as follows:
<div class="col-xs-12">
<button data-testid="continueCheckoutButton" ng-
class="continueDellMetricsClass" ng-click="continueButtonClick()" ng-
disabled="disableContinueButton" class="btn btn-success btn-block
continueButton" data-metrics="" type="button" style="background:
rgb(204, 136, 136); border: 2px solid red;">Checkout</button>
<div>
<button ng-class="continueDellMetricsClass" ng-
click="continueButtonClick()" ng-disabled="disableContinueButton"
class="btn btn-success btn-block continueButton" data-
testid="continueCheckoutButton" data-metrics="" type="button"
style="background: rgb(204, 136, 136); border: 2px solid
red;">Checkout</button>
</div>
This is what results in 3 elements match:
//button[#data-testid = 'continueCheckoutButton']
Please help!
To distinguish target button from two other you can try:
//button[not(#style) and .="Checkout"]
P.S. If HTML for all nodes seem to be identical, you can use index of required one:
(//button[not(#style) and .="Checkout"])[1]
Note that in XPath indexation starts from 1, so index for the first node will be [1].
You can also use find_elements...() instead of find_element...() to get a list of elements and select required with [index].
To click on the button with text as Checkout you have to induce wait through WebDriverWait and you can use either of the following code block (Python) :
CSS_SELECTOR :
button.btn.btn-success.btn-block.continueButton[ng-class='continueDellMetricsClass'][data-testid='continueCheckoutButton']
XPATH :
//button[#class='btn btn-success btn-block continueButton' and contains(.,'Checkout')]
Note : As the element is a Angular element you have to induce proper WebDriverWait through your respective Selenium Language Binding Art.
Update
As per your updated HTML you can use the following Locator Strategy :
XPATH :
//button[#class='btn btn-success btn-block continueButton' and contains(.,'Checkout') and not (#style='background')]
//div[#class='col-xs-12']/button[#class='btn btn-success btn-block continueButton' and contains(.,'Checkout')]
Try this.
I'm trying to print a button in html passing it as a parameter in angular2 but angular2 never translate it.
modal.component.ts
this.footer = `<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>`
modal.component.html
<div class="modal-footer" [innerHTML]="footer"></div>
output html
<div class="modal-footer" ng-reflect-inner-h-t-m-l="Close">Close</div>
Should be innerHtml instead of innerHTML. It is case sensitive.
For example :
<div class="modal-footer" [innerHtml]="footer"></div>
This drives me crazy. I want to pass a string literal as a parameter to a function in HTML onclick property containing a double quote.
My HTML element looks like this:
<button onclick = "ok_button_click(""Harry Potter "")" type="button" class="btn btn-default">ok</button>
But when I load the page and open it by Inspect Element, I see a space inserted between the first quote resulting in this:
<button onclick = "ok_button_click(" "Harry Potter"")" type="button" class="btn btn-default">bad</button>
Why does the browser insert a space ???
If you are trying to pass a string value with quotes then you have to use " like this:
<button onclick = "ok_button_click('"Harry Potter"')" type="button" class="btn btn-default">bad</button>
If you just want to pass in a string literal you can just use a single quote (or the opposite of what the attribute started with) like this:
<button onclick = "ok_button_click('Harry Potter')" type="button" class="btn btn-default">bad</button>
That is because when the DOM is being parsed the browser uses " as delimiters, so in your case it is assigning ok_button_click( to the attribute onclick and Harry Potter as a separate (and unknown) attribute.
A better way of writing this code would be mixing single and double quotes as in:
<button onclick="ok_button_click('Harry Potter')" type="button" class="btn btn-default">ok</button>
A good start on HTML debugging is to run it through a validator, like in https://validator.w3.org/#validate_by_input
Try :
<button onclick = 'ok_button_click("Harry Potter")' type="button" class="btn btn-default">ok</button>
urls.py contains the line:
url(r'^topics/$', views.topics, name='topics'),
views.py contains the code:
def topics(request):
context = locals()
return render(request, 'topics.html', context)
The following bootstrap code is used to open "topics.html"
<p><a class="btn btn-warning" href="/topics/" role="button">More »</a></p>
The above code renders "topics.html" correctly which is a table.
Now, I want the cursor to go to a specific row( Ex: first row) in the table.
It's not clear for me what cursor you mean, but may be you can assign a unique id to each row like
<tr id="row-1"><tr id="row-2"><tr id="row-3"><tr id="row-4">
then you can jump to that id using
<a class="btn btn-warning" href="/topics/#row-1" role="button"></a>
<a class="btn btn-warning" href="/topics/#row-2" role="button"></a>
...
it may look a little bit basic, but with the few clues you set i think it could be a start...