I'm using client side rendering to render a table with data that is sometimes too long to display on a page. I therefore display only the first 50 characters and add a ... with a tooltip containing all of the content.
<td data-toggle="tooltip" data-placement="top" data-container="body" title="#r.Items">
#(string.IsNullOrEmpty(r.Items) ? "" : r.Items.Substring(0, Math.Min(r.Items.Length, 50)) + (r.Items.Length > 50 ? "..." : ""))
</td>
Is there any possible way to allow the search feature to search not only for the shortened content, but also for the tooltip?
Related
I have a dynamic table rendering where columns and rows of the table are rendered dynamically.
So here I have two sibling <td> elements in each row:
<td :key="`td3-${index}`" :id="`show_${key}`" v-show="`show_${key}`">
<input type="text" :v-model="key" :name="key" :value="entry[key]" />
</td>
<td :key="`td4-${index}`">
Edit
</td>
In the onclick event of the link in the second <td> I have to show and hide the first <td> element. Since it's dynamic I will have multiple rows. So I declared a dynamic boolean in my data to show and hide the specific <td> based on the click of another <td> in the same row.
v-show="`show_${key}`" - this is show property with dynamic key
show_firstname: false,
show_lastname: false,
show_email: false,
show_orgname: false
I created separate boolean elements for every <td> in each row.
But whenever I change the value of v-show property with the on click of second <td> element it's not making any difference. So I could not show or hide the <td>. Maybe v-show takes "`show_${key}`" as a string value not replacing true or false correctly. Can someone help me how can I achieve this?
Why don't you try organising the show_ in an object instead of a flat list of properties?
https://codesandbox.io/embed/vue-template-csncc?fontsize=14&hidenavigation=1&theme=dark
I have just started using Galen with Java + TestNG framework and am trying to figure out how to verify text of an element that has a CSS property display: none associated with it.
Dom structure of that element looks something like this
<td id="invoice-gridrow-1-cell-2">
<span class="textbox-container horizontal-layout controlElement">
<input class="textbox-control cost right" type="text" value="1" id="invoice-gridrow-1-cell-2-txt-0" aria-label="">
<span class="shadow-textbox textbox-control cost right" tabindex="0">1</span>
</span>
</td>
Element span class="shadow-textbox textbox-control cost right"has a property display: none associated with itself.
I would like to verify the text of that span (span class="shadow-textbox textbox-control cost right"), but it says that the element is not visible on page
I tried to verify text of its parent span element span class="textbox-container horizontal-layout controlElement", but it says that the text is "" but should be "1"
Any help on this would be highly appreciated.
I try to get a href from an anchor according to linkText given with func param (for example here Westwood or Linda).
In the code below I changed classes values (cause of company info), but beside thats the code. For each <tr> the hrefs are identical for both <td>, but different from <tr> to <tr>
I get the 1st href with:
driver.findElemnt(By.xpath("//a[#class = 'class Name of a']").getAttribute("href")
or the same with:
xpath="//a[#class = 'class Name of a'][1]";
but when I go:
"//a[#class = 'class Name of a'][2]" or 3 or 4...
or when I use:
By.partialLinkText
It fails, so I never get beyond the 1st <td> of the first <tr>.
The Error: oopenqa.selenium.StaleElementReferenceException : Element
is no longer attached to the Dom.
The Elements are visible all the time, so its not a visibility problem.
This is the html:
<tr class="Class name for tr here">
<td headers="description _ CustomerList:lastName">
Westwood
</td>
<td headers="description _CustomerList:firstName">
Linda
</td>
</tr>
You're trying to retrieve the second anchor tag within the same parent (in the example document: table cells).
Instead of
//a[#class = 'class Name of a'][2]
query the second anchor tag in the whole document:
(//a[#class = 'class Name of a'])[2]
Some more examples how to use positional predicates (I omitted the class predicate here):
Anchor tags from all second table cells per row:
//td[2]/a
Second anchor tag per row:
//tr//a[2]
I want to get tooltip information enabling on JavaScript. I have tried with below code but its shown null every time.
Java Code:
Actions action = new Actions(driver);
WebElement element = driver.findElement(By.xpath("//*[#id='content']/div/div/div[1]/div/div[2]/div[2]/div/div[3]/div[1]/table/tbody/tr[1]/td[2]/span/div/a"));
action.moveToElement(element).build().perform();
System.out.println(driver.findElement(By.xpath("//*[#id='content']/div/div/div[1]/div/div[2]/div[2]/div/div[3]/div[1]/table/tbody/tr[1]/td[2]/span/div/a")).getAttribute("data-original-title"));
HTML Code is:
<tr class="single" name="Tasks_59c777d9-8d16-694a-7307-52caad36d751">
<td>
</td>
<td data-type="custom_task_name">
<span class="list" sfuuid="3840" data-original-title="">
<div class="ellipsis_inline" data-original-title="">
Task Testing
<br/>
Toney Harber
</div>
</span>
</td>
I have tried with span tag but this also shows null.
I am providing you 2 options try both.
Option 1
Please try below. It will return you a list. Loop through it. If there is only one span then you can get the element and then get the attribute value.
driver.findElements(By.xpath("//span[#data-original-title]"))
Option 2
Instead of
driver.findElement(By.xpath("//*[#id='content']/div/div/div[1]/div/div[2]/div[2]/div/div[3]/div[1]/table/tbody/tr[1]/td[2]/span/div/a"))
use findElements
driver.findElements(By.xpath("//*[#id='content']/div/div/div[1]/div/div[2]/div[2]/div/div[3]/div[1]/table/tbody/tr[1]/td[2]/span/div/a"))
It will return a list of web elements. Loop thorough it you might get more than one element.
MVC3 VB.NET Razor view Application... I have a view that uses a for each loop to display all the available courses. Next to each of these I would like to place a Html link to download that courses class handout file. Problem is I have not found anything on any forums about assigning the value to the hyperlink dynamically since it will vary with every iteration of the for each loop. I have coded the model to hold the file name associated with each class. Below is a snippet from the view...
#For Each item In Model
Dim currentItem = item
Dim Handout = Path.Combine((AppDomain.CurrentDomain.BaseDirectory) + "CourseHandouts\") + currentItem.handoutFile1
#<tr>
<td>
#Html.DisplayFor(Function(modelItem) currentItem.course_ref)
</td>
<td>
#Html.DisplayFor(Function(modelItem) currentItem.course_title)
</td>
<td>#Html.DisplayFor(Function(modelitem) currentItem.course_start)</td>
<td>#Html.DisplayFor(Function(modelitem) currentItem.course_end)</td>
<td id="Actions">
#Html.ActionLink("Details", "CourseDetails", New With {.id = currentItem.course_id})
</td>
Course Handout
</tr>
Next
Anyone have any ideas on how I could create a unique download link for each file???
You need to make the link point to a client-facing URL:
<a href="#Url.Content("~/CourseHandouts/" + currentItem.handoutFile1)">
you also have the much overlooked #Href() which can be popped in in place of #Url.Content():
Download File