Vue href binding with static url - html

I want to pass a static href + a dynamic part provided through a v-for. In one of the td Something like this. Now, it's reading it as a string.
<td class="">
**<a class=" " href="https://xxx.yyy.us/org/ `${{currentView["projectName"]}}`"**
target="_blank"
><img
class="inline-block w-10"
alt=""
src="../assets/img/mylogo.svg"
/></a>
</td>

Use v-bind to bind vue instance data to html attributes.
Shorthand for v-bind is : which we will use below
<a class=" " :href="'https://xxx.yyy.us/org/' + currentView['projectName']"/>
<!--...-->
</a>

Related

HTML Partial View within Foreach

My index views in MVC contain a row per row set of actions like so:
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.SomeProperty)
</td>
<td>
<a asp-action="Edit" asp-route-id="#item.ID" class="btn btn-warning" style="margin-top: -8px">
<span class="fa fa-pencil" alt="Edit" />
</a>
<a asp-action="Details" asp-route-id="#item.ID" class="btn btn-primary" style="margin-top: -8px">
<span class="fa fa-info-circle" alt="Details" />
</a>
<a asp-action="Delete" asp-route-id="#item.ID" class="btn btn-danger" style="margin-top: -8px">
<span class="fa fa--trash" alt="Delete" />
</a>
</td>
</td>
}
There are other index pages where the 3 buttons will get reused so that already suggests a partial view just to save redundant code, the other part is I have to have the alt tag in the spans for 508 compliance so I want a partial view to help with consistency.
Problem is, if I just copy and paste the 3 buttons into a partial view, then I get "The name 'item' does not exist in the current context" and if I try to bring over the foreach, then I get more then one set of buttons in each row. Any ideas?
What I believe is that your problem is related to the model which you didn't pass to the partial. There are some ways that you can pass your model to the partial view.
Think you have an Index view which has a model:
#model YourProjectNameSpace.Models.NameOfModel
......//Other HTML codes
when you want to call the partial view inside this view you should pass the model:
#Html.Partial("_MyPartial",Model)
Also inside of your partial view, you need to add the following line in the beginning:
#model YourProjectNameSpace.Models.NameOfModel

Thymeleaf: From controller to html

I have a table of values with an href.
<tr th:each="note : ${test}">
<td th:text="${note.name}">></td>
<td th:text="${note.lastName}"></td>
<td th:text="${note.studentId}"></td>
<td>
<a th:href="#{'/seeStudent/' + ${note.studentId}}">Ver</a>
</td>
</tr>
This is my controller:
#GetMapping("/seeStudent/{id}")
public String getStudentById(#PathVariable Long id, Model model) {
model.addAttribute("student", repo.findById(id));
return "seeStudent";
}
This is my HTML:
<div>
<h1>Student information</h1>
<ul>
<div th:object="${student}">
<li>
<h4>
<span th:text="${name}"></span>
</h4>
<h4>
<span th:text="${lastName}"></span>
</h4>
</li>
</div>
</ul>
</div>
For some reason the display is comming up blank, it is as if it wasn't finding the student by Id. When I debug it does locate the student and return it. I believe I may be doing something wrong when trying to pull the object data and display it in my html. Any ideas?
If you're using th:object, your expression should be (with an asterisk) *{name} and *{lastName}. If you want to use the equivalent (dollar sign) ${...} expression, it would be ${student.name} and ${student.lastName}.

Xpath Get elements that are between 2 elements where we can't use an id or text to identify the 2nd tag

I have a similar problem to this question Xpath Get elements that are between 2 elements. But in my specific case the html can vary and I can't use the text of the second element
Basically I have an structure like:
<h1>Account Information</h1>
<a class="null" href="http:...">Remarks</a>
<a class="null" href="http:...">Owner Information</a>
<b>Account Detail</b>
<a class="null" href="http:...">Industrial</a>
<a class="null" href="http:...">land</a>
<b >Transfers</b>
<a class="null" href="http:...">11111</a>
<a class="null" href="http:...">22222</a>
So I want get <a> between the b='Account Detail' and the next b that can vary the text.
For this cases I used a version of the 2nd answer of question above
//a[preceding-sibling::b='Account Detail' and following-sibling::b]
for this case works ok because have only one b after the b='Account Detail'
I got
[Industrial,land]
But If we have more than one <b>after the b='Account Detail'
But If we have more than one <b>
<h1>Account Information</h1>
<a class="null" href="http:...">Remarks</a>
<a class="null" href="http:...">Owner Information</a>
<b>Account Detail</b>
<a class="null" href="http:...">Industrial</a>
<a class="null" href="http:...">land</a>
<b class="">Permits</b>
<a class="null" href="http:...">12-12-222</a>
<a class="null" href="http:...">22-2-22</a>
<b >Transfers</b>
<a class="null" href="http:...">11111</a>
<a class="null" href="http:...">22222</a>
The result is:
[Industrial,land,12-12-222,22-2-22]
Which is not the desired behavior
Any advice?
thanks in advance
Try below XPath to get required nodes:
//a[preceding-sibling::b[1]='Account Detail' and following-sibling::b]
preceding-sibling::b[1]='Account Detail' intend to fetch anchor that has no preceding-siblings <b> before the one with 'Account Detail' content

How to get value of <a name=""> in JSP

So i have this html
<tr>
<%
ArrayList<Project> projects = (ArrayList<Project>)session.getAttribute("projects");
for(Project p: projects) {
%>
<td>
<a href="GoToProjectPage" name="projecttitle">
<%=p.getProjectTitle()%>
</a>
</td>
</tr>
however, i do not know how to get the "projecttitle" in the a href. I tried using the code below but it does not work. we are required to use MVC
request.getParameter("projecttitle")
Add the parameter to the href of the <a> element:
<a href="GoToProjectPage?projecttitle=<%=p.getProjectTitle()%>">
<%=p.getProjectTitle()%>
</a>

How do i get the HTML element in the same row as a XPATH Contains?

I am using Selenium with Python. I have a table. I found the row which has the text 'Honorable' in it by using this Xpath :-
element = driver.find_element_by_xpath("//*[contains(., 'Honorable')]")
Now I need to click the Edit button which has the below HTML (taken from Chrome's Inspector Tools)
<a id="prefixmasterListForm:prefixMasterTable:0:editLink
The full HTML is:
<tr class="rich-table-row rich-table-firstrow ">
<td class="rich-table-cell " id="prefixmasterListForm:prefixMasterTable:0:j_id347" width="auto">
Honorable
</td>
<td class="rich-table-cell alignCenter" id="prefixmasterListForm:prefixMasterTable:0:j_id350" width="auto">
<img id="prefixmasterListForm:prefixMasterTable:0:activeic" src="images/yes.gif" alt="active">
</td>
<td class="rich-table-cell " id="prefixmasterListForm:prefixMasterTable:0:j_id352" width="auto">
General Prefix
</td>
<td class="rich-table-cell " id="prefixmasterListForm:prefixMasterTable:0:j_id360" width="auto">
MALE
</td>
<td class="rich-table-cell " id="prefixmasterListForm:prefixMasterTable:0:column6" width="auto">
<a id="prefixmasterListForm:prefixMasterTable:0:editLink" href="#" onclick="if(typeof jsfcljs == 'function'){jsfcljs(document.forms['prefixmasterListForm'],'prefixmasterListForm:prefixMasterTable:0:editLink,prefixmasterListForm:prefixMasterTable:0:editLink,prefixMasterId,15661602','');}return false">
<img src="images/iconedit.gif" alt="Edit" class="image">
</a>
<a id="prefixmasterListForm:prefixMasterTable:0:deleteLink" href="#" onclick="if(typeof jsfcljs == 'function'){jsfcljs(document.forms['prefixmasterListForm'],'prefixmasterListForm:prefixMasterTable:0:deleteLink,prefixmasterListForm:prefixMasterTable:0:deleteLink,prefixMasterId,15661602,prefixMasterName,Honorable','');}return false">
<img src="images/icondelete.gif" alt="delete" class="image">
</a>
</td>
</tr>
How do i get hold of that Edit link element using XPath?
Based on Arran's help i also checked that the column next to 'Honorable' has an image with alt=inactive like this
"//td[normalize-space(text())='Honorable']/following-sibling::td[img[#alt='inactive']]"
//td[normalize-space(text())='Honorable']/following-sibling::td//a[.//img[#alt='Edit']]
The td that has it's text equal to 'Honorable', then get the td following it, that has an a inside it, which has an image within it that has it's alt attribute set to 'Edit'
Easy: //tr[td[contains(., 'Honorable')]]/td/a[contains(#id, ':editLink)] - literally, the A contained in the TD contained in the TR that also contains a TD that contains the string "Honorable".
Try: //a[#id='prefixmasterListForm:prefixMasterTable:0:editLink']
P.S.If you want to verify or do some easy job with xpath, you can install FF + FireBug + FirePath