I am working for a project where I need to convert the html that photoshop generates to email client compatible.
Once I receive a psd file, I need to create slices and then generate the html. The problem is that the generated html has tables with rowspan and colspan. I then manually remove these colspans and rowspans and nest tables to achieve the same layout.
My question is, is there a library or something that I can use to automate this task?
Below is just an example, the real problem can include various colspans and rowspans in any specific order.
Example -
PS code ->
<tr>
<td colspan="3">First row 3 columns</td>
</tr>
<tr>
<td>Second row first column</td>
<td>Second row second column</td>
<td>Second row column column</td>
</tr>
I will then have to code this as -
<tr>
<td>First row 3 columns</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>Second row first column</td>
<td>Second row second column</td>
<td>Second row column column</td>
</tr>
</table>
</td>
</tr>
I work for a company who deliver many HTML emails everyday, i'm email HTML developer, and we use Fireworks (CS6, he's not in the CC..) to generate nested tables (some options are to define).
G.
Related
I am trying to populate table with an object which contains an array. I am able to successfully do that but I want each task name to have its own row right now they are coming in a single row.
{level_image :"image"level_name:"1"task_name: ["game","taskgame","jenga"]}
<tr v-for="tel in result" :key="tel.level_image" :pey="tel.level_name">
<td>{{tel.level_image}}</td>
<td>{{tel.level_name}}</td>
<td v-for="task in tel.task_name">{{task}}</td>
</tr>
You're missing the obvious: if you want each one to have its own row, you need to put the v-for in a <tr> tag (like you did for result). Exactly how you deal with the <td>s is up in the air, but it might go like this:
<tr v-for="tel in result" :key="tel.level_image" :pey="tel.level_name">
<tr v-for="task in tel.task_name">
<td>{{tel.level_image}}</td>
<td>{{tel.level_name}}</td>
<td>{{task}}</td>
</tr>
</tr>
Or if you mean you want each one to be on a separate line within a table cell, it could be
<tr v-for="tel in result" :key="tel.level_image" :pey="tel.level_name">
<td>{{tel.level_image}}</td>
<td>{{tel.level_name}}</td>
<td><div v-for="task in tel.task_name">{{task}}</div></td>
</tr>
The main idea is that you want the v-for to be associated with the type of tag that creates the entity you want each task in.
I have an issue with selecting a table to be read in Selenium.
I have a table in which there is two 'tr' elements inside the 'thead', and I need to find a way to ignore the first of these.
Here is the code:
<table class="noselect">
<thead>
<tr>
<th> </th>
<th class="number IOL">Interest Rates</th>
<th class="number IO">
</tr>
<tr>
<th>Description</th>
<th class="number">Value</th>
<th class="number">Percentage</th>
</tr>
</thead>
<tbody>
<tr>
<tr class="">
<tr class="">
<tr class="">
<tr>
<tr>
</tbody>
</table>
Using Selenium I will ask it to record the value of a certain row and column . This will then look at the Table element I will give it (hopefully using an XPath I can get working in this case), look at the thead and record the headers of each column. In this case that I am struggling with, the fact there is an extra 'tr' at the top of this table gets in the way of this process.
This is how the element is currently used:
[TableAlias("Detailed table")]
protected virtual IWebElement DetailedTable()
{
return Driver.FindElement(By.XPath("//table[#class='noselect']"));
}
I have tried many different ways which I can't get to work, but the gist of what I've been going for is:
//table[#class='noselect movements']/thead/tr/th[not(text()='Interest Rates')]/../../..
Here I'm stuck on going to the 'tr' element, telling it not to use it then backing out, but that selects it back again - and even that doesn't unselect the whole 'tr' element. It doesn't seem to help (to me) that the 'tr' element I'm trying to remove is blank with no class or defining features.
Is there a way of selecting the entire table except for the first 'tr' element in 'thead' as one element?
combine two xpathes. The 1st xpath take thead without the 1st tr and the 2nd tbody
//table/thead/tr[not(position()=1)] | //table/tbody
In your function that processes the THEAD tag, get the collection of TRs and start with [1] (skipping [0]) and process the rest.
I got this page where I want to run my code:
I got a css with this properties:
<center>
Radicacion Exitosa, Numero Radicacion: 12 - 132263…
</center>
I want to store the "132263" in a variable because I have to copy and paste them in another window, so I want to know if there is a way to only get the number from that tag...specially the "132263" because if I store a Variable Selenium IDE only will get the full text.
Thanks
Using regex in javascript will do this for you:
<tr>
<td>storeText</td>
<td>//center</td>
<td>full</td>
</tr>
<tr>
<td>storeEval</td>
<td>var regex=/\-\s+(\d+)\s+\-/;regex.exec(storedVars['full'])[1];</td>
<td>number</td>
</tr>
<tr>
<td>echo</td>
<td>${number}</td>
<td></td>
</tr>
We're capturing the text from the CENTER tag and then running the regex to grab the number out of it (using the group (\d+) and returning [1]).
I'm writing test cases for a webpage that has a table as the main focus of the page. I'm checking that the page contains a new entry via the Page Should Contain fucntion, I then want to find the xpath for this element. I am doing this because each entry is added to the end of the table so I cannot set a static xpath for it because I don't know how many entries will be added between each run of this particular test.
Thanks in advance.
<table class="fw-table">
<thead>
<tr class="affix-header">
<th class="columnwidth-description">Email</th>
<th>Account</th>
<th>Signed up</th>
<th>Number of invalid attempts</th>
</tr>
</thead>
<tbody>
<tr>
<td>devtest</td>
<td>Account</td>
<td>true</td>
<td>0</td>
</tr>
<tr>
<td>test#testing.com</td>
<td>Account</td>
<td>true</td>
<td>1</td>
</tr>
search for: xpath=//body/div[2]/div/div[2]/div[2]/div/div/table/tbody/tr[1]/td[1]
If you need to verify that last table row contains certain text you can use the Page Should Contain Element keyword and provide an xpath locator which will find the last table row containing your text:
Page Should Contain Element xpath=//table[#class="fw-table"]//tr[last()]//td[contains(text(),'bottomline')]
is there a way to add cells in a row column in html table without adding another table inside the row column
I have attached the image. and here is my code
<tr>
<tbody>
<td>Name</td>
<td><div id="span1">Units</div>
<div id="span2" class="side-border">price</div>
<div id="span2" class="r">value</div>
</td>
</tbody>
</tr>
If you want to have some different structure of your rows, you should check colspan and rowspan. The numbers should add up.
Example
<table border="1px">
<tr>
<td colspan="5">Hello</td>
<td>World</td>
</tr>
<tr>
<td rowspan="2">col 1</td>
<td colspan="4">CENTER</td>
<td>right</td>
</tr>
<tr>
<td colspan="3">Text</td>
<td colspan="3">bottom right</td>
</tr>
</table>
If you were to add the numbers from colspan they add to 6 and rowspan goes to 3. There are some things you have to take care of though. It's a little hard for me to explain now what those are, just try to visualise how you want your table to look, and then follow this:
The table should have the max number of rows
The table should have the max number of columns
rowspan used across table has to add up (more or less)
colspan used across table has to add up (more or less).
Follow that, and after writing the HTML for a few "complex" tables, you'll get the gist of it.