In my Qt project I'm using the QWebView to load my html table data.
I'm using the findText function to find text in the html page.
But, I can't find invisible text...
HTML sample :
<table>
<tr>
<td> hello </td>
</tr>
<!-- invisible data -->
<tr style="display:none">
<!-- I want to find this value -->
<td> hey </td>
</tr>
</table>
Is there a way to find invisible text elements via Qt?
I know that I can evaluate JavaScript function for that..
But still I'm looking for some Qt solution?
Thanks in advance.
You can use QWebFrame::findAllElements() function which will perform elements look up by CSS selector and return all found elements as QWebElementCollection regardless of their visibility. From that list you can find the QWebElement that correspond to your searching criterion.
Related
I'm trying to figure out how to output a block of HTML from Wordpress that looks like this:
<table>
<tr>
<td> Link to first headline </td>
<td> Link to fourth headline </td>
</tr>
<tr>
<td> Link to second headline </td>
<td> Link to fifth headline </td>
</tr>
<tr>
<td> Link to third headline </td>
<td> Link to sixth headline </td>
</tr>
</table>
I used to be able to do this with Moveable Type quite easily but cannot for the life of me figure it out. Any guidance would be appreciated.
You should be able to use a Custom HTML widget(Appearance > Widgets) or put the code in the Editor on a page. Make sure you're in the Code Editor and not the Visual Editor (There should be tabs at the top that let you switch. If you're already in the Gutenberg editor then it'll be three vertical dots on the upper right of the screen.)
For linking the headers, you can select the text and link using the link (chain-looking) icon at the top of the editor that will let you select another part of your page. This will be in the Visual Editor, though you can input your own links using the code as well.
Hope that helps!
The HTML page contains a table of users details.
I need to remove user.
I can select the first element in the row by username.
I need to select the "Delete" button on that row to delete that user.
The HTML structure is:
<table id="tblUsersGrid" cellpadding="2">
<thead>
<tbody>
<tr class="aboutMeRow" data-parentid="223">
<tr>
<tr>
...
<tr>
<td class="cell cell_278 cell_NameCell">xoxo</td>
<td class="optionIcon overrideFloat orgIcon cell cell_278 gridCell"></td>
<td class="cell cell_278 gridCell">Custom</td>
<td class="cell cell_278 gridCell">qaadmin</td>
<td class="cell cell_278 gridCell">0</td>
<td class="cell gridCell">
<div class="removeAccountIcon"></div>
<td class="cell gridCell">
<div class="editAccountIcon"></div>
</td>
<td></td>
</tr>
So I can easily select the desired row by
driver.findElement(By.xpath("//td[#class='cell_NameCell'][contains(text(),'xoxo')]"))
But how can I reach the removeAccountIcon element on that row?
I saw many questions dealing with selecting elements inside tables but didn't find solution for this issue.
Is there a way to do this by CSS selector, not only by Xpath? (I am sure there is a Xpath solution for this).
You can make it in one go using the following XPath expression:
//tr[td[contains(#class, 'cell_NameCell')] = 'xoxo']//div[#class='removeAccountIcon']
Here we are locating the appropriate tr row by checking the text of the td element containing cell_NameCell class (this is your username cell). Then, we locate the "Remove Account Icon" inside this row.
Xpath axes preceding-sibling would helps you to resolve the issue. You can try below xpath:
//td[preceding-sibling::td[contains(text(),'xoxo')]][5]/div[#class='removeAccountIcon']
Let me know if it works for you.
If you can select the correct row, you can select the desired element within that row by calling findElement on that row instead of the original driver. However, the code you suggested for finding the correct row doesn't appear to work. (It selects a td instead of a tr.)
I would suggest the following:
WebElement userDataInRow = driver.findElement(By.xpath(//td[contains(text(),'xoxo')]))
WebElement row = userDataInRow.findElement(By.xpath(".."))
row.findElement(By.xpath("//div[#class='removeAccountIcon']"))
The second line goes to the parent element of the selected td element.
I don't think there is an option to find the parent by using the css selectors.
This article gives other alternates for finding the same.
To capture the "Remove" button by using the xpath, we just need to traverse back to the parent of the "Name" cell of the table and then fetch the "div" of the "remove link/button".
Then your xpath //td[#class='cell'][contains(text(),'xoxo')] should be updated as below :
//td[contains(text(),'xoxo')]/../td/div[#class='removeAccountIcon']
This will capture the "Remove Account Icon" based on the given name.
Okay, the title is worded terribly, I know. I really don't know exactly how to describe this.
I am editing a "website" but I don't have access to HTML or Javascript or PHP or anything else. Only CSS, and I can creatively manipulate the HTML already presented in the website.
<div id="list">
<table>
<tbody>
<tr>
<td class="td1">blahblahblah</td>
<td class="td1">blahblahblah</td>
<td class="td1">blahblahblah</td>
<td class="td1"><a href="bleach.com">Bleach</td>
<td class="td1">Score: 9</td>
</tr>
<tbody>
</table>
<table>
<tbody>
<tr>
<td class="td2">blahblahblah</td>
<td class="td2">blahblahblah</td>
<td class="td2">blahblahblah</td>
<td class="td2">Naruto</td>
<td class="td2">Score: 10</td>
</tr>
<tbody>
</table>
</div>
So this is basically how it's set up. These are 2 anime, Bleach and Naruto. Naruto's score is a 10, Bleach's is a 9. My goal is to select the parent table of the anime that contains a score of 10 so that I can set up a specific hover animation event using keyframes whenever an anime with a score of 10's table is hovered over.
Now the way this is set up, I don't think there's any way to do it other than manually selecting each anime with a score of 10 by doing something like #list > table > td:nth-of-type(4) a[href*="naruto.com"] though I'm not sure that's relevant. That's how I can select the child, but how do I select the table parent to style it for hover? There must be a way. :(
Appreciate any help you can offer. If you leave a comment within the next day I should be able to respond back immediately.
Thanks.
Please keep in mind, I can not simply give a table a class or id. I have no access to adding or editing anything within the set HTML. So I need to figure out a different method. Also, selecting the table by doing #list table:nth-of-type(n) is not possible because the list of tables will be ever-changing (tables added/removed), can be sorted (altering n), and the sheer volume (we're talking hundreds of tables) etc. which would throw it out of play.
This is not possible using only CSS. You need to select for an attribute at least. There was a proposal for a :content selector for CSS 3, but that didn't end up in the spec. (More info here).
My spirits were not dampened. I figured out a way to do it. By manipulating another td I don't need that's within the table that has a score of 10 and setting it to transparent and positioning it over the entire table, giving it a z-index of 1, and all of the other elements within the table a z-index of 2, I can cause the event on table hover to occur as I wished. :) I'm just posting this here in case anyone ever has a problem like this and this may help them as well.
Is it possible to draw a dynamic bar graph in email body. (need to be compatible with Outlook)
I need to draw a graph in email sent through oracle database and dynamic value will be passed through a procedure.
The best solution is to create your bar chart dynamically then transform it into an image. You could simply use print screen for this and import it into Photoshop or whatever and edit the image there.
HTML emails are notoriously bad things in that they respond best to html code from 10+ years ago.
Some basic guidelines:
Don't try to use HTML5 in an email.
Don't try to use fancy CSS or link to an external stylesheet or even use css styles in the HEAD.
Don't try and use javascript as it won;t work
Don't try and use Flash as it won't work.
DO use inline CSS
DO use HTML TABLES for layout
DO use images but try and keep the filesize as small as possible.
You could use something like google charts to create a dynamic image (passing through the correct data sets) that you embed into your html email.
http://imagecharteditor.appspot.com/
http://www.jonwinstanley.com/charts/
You can't do anything with JavaScript, because email clients don't parse it.
But you can tell your server to set a header on the file to make it a JPEG or GIF. The file extension should also be jpg or gif, because some email clients freak out at rendering an image that doesn't have an extension, or has a non-image extension. Not sure what you're using server-side but most have some kind of dynamic image producing library.
Alternatively, render the graph using tables.
<table>
<tr>
<td colspan="10" bgcolor="pink"></td>
</tr>
<tr>
<td colspan="5" bgcolor="pink"></td>
<td colspan="5" bgcolor="white"></td>
</tr>
</table>
You get the idea. Unfortunately, you'd have to write something to generate the relevant HTML.
This has to be done the "old" html way. Meaning with tables and plain images.
Let's say you want to create a bar graph with 5 items. You create a table with all the cells you need, and then you would have, let's say 5 different images you would scale dynamically vertically when sending the personalized email. Every image is just a solid block of, let's say 10x10px in 5 different colors. You would override the size of the image to the size of the block for every email sent. Then you would place the substitute pattern of your emailer application (i.e. %%variable%%) and use the right values for every single email sent.
for example:
<table border=0>
<tr>
<td align=bottom><img src=redblock.gif width=20 height=%%height1%%></td>
<td align=bottom><img src=greenblock.gif width=20 height=%%height2%%></td>
<td align=bottom><img src=yellowblock.gif width=20 height=%%height3%%></td>
<td align=bottom><img src=blueblock.gif width=20 height=%%height4%%></td>
<td align=bottom><img src=greyblock.gif width=20 height=%%height5%%></td>
</tr>
<tr>
<td colspan=5 bgcolor=#000000 height=1><img src=singlepixel.gif width=1 height=1></td>
</tr>
<tr>
<td>Spain</td>
<td>France</td>
<td>US</td>
<td>UK</td>
<td>Italy</td>
</tr>
</table>
I have an asp page and I am trying to set the background color of a cell based on a dynamic value in that cell. I have created pages already where the values can be edited. This in a simple IN/OUT check-in for our team. For instance, if the value is set to "IN", the the background color is to be green. If the value is "OUT", then set background color is red. If the value is "WAH", then set it to orange. We have 7 Techs that will update this themselves. I have searched for examples, but nothing even close has come up. Besides doing simple web based reports on ASP pages, I know little else. Any help and guidance is appreciated.
Here is my table code. Pretty simple.
<table width="500" border="1" align="center" bordercolor="#000000">
<tr>
<td> </td>
<td>
<div align="center"><strong>Mon</strong>
</div>
</td>
<td>
<div align="center"><strong>Tues</strong>
</div>
</td>
<td>
<div align="center"><strong>Wed</strong>
</div>
</td>
<td><div align="center"><strong>Thur</strong></div></td>
<td><div align="center"><strong>Fri</strong></div></td>
</tr>
You should rather run this check on your server while generating the page contents and assign appropriate CSS classes to the cells so that they can be styled any way you like. CSS does not allow textContent matching.