Table inside a table - html

I've added a table inside a table.
<tr>
<td colspan="10">
<table border="2" cellpadding="1" cellspacing="1">
<tr>
<td>col1 </td>
<td>col2</td>
</tr>
<tr >
<td >TEST </td>
<td >33444</td>
</tr>
<tr >
<td >TEST</td>
<td >9900</td>
</tr>
</table>
</td>
</tr>
But I want "TEST" values under col1 and numeric values under col2. Currently all values are shown under col1.
Edit - Actual Code
<tr>
<td colspan="10">
<table class='<%= "table"+count%>' style="display:none" border="2" cellpadding="1" cellspacing="1">
<tr>
<td>col1 </td>
<td>col2</td>
</tr>
<nested:iterate property="equipC" id="equipmentFormBean" indexId="ffIndex" >
<tr class='<%= "table"+count%> dataOff' style="display:none">
<td align="right" ><nested:write property="equipInitial" /> </td>
<td ><nested:write property="equipNum" /> </td>
</tr>
</nested:iterate>
</table>
</td>
</tr>
How to do it?


Use Google chrome...Your html code is right.On my PC I see the values are in COL2.


Use Forgot to use table heading heading tag "th"
<tr>
<td colspan="10">
<table border="2" cellpadding="1" cellspacing="1">
<tr>
<th>col1 </th>
<th>col2</th>
</tr>
<tr >
<td >TEST </td>
<td >33444</td>
</tr>
<tr >
<td >TEST</td>
<td >9900</td>
</tr>
</table>
</td>
</tr>


Your HTML code is correct. With the html provided by you it displayed the tables properly. You may please see it here # FIDDLE - http://jsfiddle.net/BRxKX/4986/
Problem could be with dynamic generation of tables and mostly around COLSPAN if at all its being used in your dynamic code.
Here is code that I tested (you can see this in - http://jsfiddle.net/BRxKX/4986/)
<html>
<head>
</head>
<body>
<table>
<tr>
<td colspan="10">
<table border="2" cellpadding="1" cellspacing="1">
<tr>
<td>col1 </td>
<td>col2</td>
</tr>
<tr >
<td >TEST </td>
<td >33444</td>
</tr>
<tr >
<td >TEST</td>
<td >9900</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>

Related

graphviz autofit TD width in html label

With the following dot
digraph structs {
node [shape=plaintext]
struct1 [label=<
<table border="1">
<tr>
<td align="left">
<TABLE border="1">
<TR>
<TD align="left">one</TD>
<TD align="left">long text here</TD>
<TD align="left">c</TD>
</TR>
</TABLE>
</td>
</tr>
<tr>
<td align="left">
<TABLE border="1">
<TR>
<TD align="left">very long text present here</TD>
<TD align="left">colb</TD>
<TD align="left">colc</TD>
</TR>
</TABLE>
</td>
</tr>
</table>
>];
}
Graphviz yields the image below (my notes with red):
Now, if I take the table HTML from above and render it in the browser, I get what I would also expect from Graphviz:
Question: how can i get Graphviz to render the table same as the browser does (no extra-space inside the columns, but instead have it after the last column) ?
If it's not possible, how do I input the node label so that I get the same result as the browser returns?
Thank you.

Possible workarounds:
digraph structs {
node [shape=plaintext]
struct1 [label=<
<table border="1">
<tr>
<td align="left">
<TABLE border="0" width="1" fixedsize="true" align="left" cellpadding="0" cellsborder="0" CELLSPACING="0">
<TR>
<TD align="left">
<TABLE border="1" >
<TR>
<TD align="left">one</TD>
<TD align="left">long text here</TD>
<TD align="left">c</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</td>
</tr>
<tr>
<td align="left">
<TABLE border="1">
<TR>
<TD align="left">very long text present here</TD>
<TD align="left">colb</TD>
<TD align="left">colc</TD>
</TR>
</TABLE>
</td>
</tr>
</table>
>];
}
rendered on: http://viz-js.com/

XPath to table cell (td) contents based upon label?

Can anyone help me to find the right XPath to retrieve the Average Win and Loss value (36.68 pips and -38.56 pips) from this web page:
https://www.myfxbook.com/members/babatrader/ic-markets-live/2595252
Here the portion of the HTML
<table class="maxWidth" cellspacing="0" id="trades">
<tbody><tr>
<td valign="top">
<table cellspacing="0" class="advanced border0L">
<tbody><tr class="bg1">
<td>Trades:</td>
<td class="alignR">2885</td>
</tr>
<tr>
<td>Profitability:</td>
<td align="right" class="pointer">
<span id="wonTip" class="Won 1619 out of 2885 trades, which represents 56%.<br/>Lost 1266 out of 2885 trades, which represents 44%."><div class="blockHolder">
<div class="greenBlock floatLeft" style="width:56px"></div>
<div class="redBlock floatLeft" style="width:44px"></div>
</div></span>
</td>
</tr>
<tr class="bg1">
<td>Pips:</td>
<td class="alignR">10571.7</td>
</tr>
<tr>
<td>Average Win:</td>
<td class="alignR">36.68 pips / €3.31</td>
</tr>
<tr class="bg1">
<td>Average Loss:</td>
<td class="alignR">-38.56 pips / -€3.56</td>
</tr>
<tr>
<td> Lots:</td>
<td class="alignR">38.94</td>
</tr>
<tr class="bg1">
<td>Commissions:</td>
<td class="alignR">-€226.56</td>
</tr>
</tbody></table>
</td>
<td valign="top">
<table cellspacing="0" class="advanced border0R border0L">
<tbody><tr>
<td>Longs Won:</td>
<td align="right">
<span class="gray">(687/1247) </span> 55%
</td>
</tr>
<tr class="bg1">
<td>Shorts Won:</td>
<td align="right">
<span class="gray">(932/1638) </span> 56%
</td>
</tr>
<tr>
<td>Best Trade(€):</td>
<td class="alignR"> <span class="gray">(Jul 20)</span> 17.93
</td>
</tr>
<tr class="bg1">
<td> Worst Trade(€):</td>
<td class="alignR"> <span class="gray">(Jul 19)</span> -32.08
</td>
</tr>
<tr>
<td>Best Trade (Pips):</td>
<td class="alignR"> <span class="gray">(Sep 07)</span> 177.5
</td>
</tr>
<tr class="bg1">
<td>Worst Trade (Pips):</td>
<td class="alignR"> <span class="gray">(Sep 06)</span> -190.0
</td>
</tr>
<tr>
<td>Avg. Trade Length:</td>
<td class="alignR">
22h 45m
</td>
</tr>
</tbody></table>
</td>
<td>
<table cellspacing="0" class="advanced border0R">
<tbody><tr class="bg1">
<td><span class="dotted" id="pfTip">Profit Factor:</span></td>
<td class="alignR">
1.19
</td>
</tr>
<tr>
<td><span class="dotted" id="sdTip">Standard Deviation:</span></td>
<td class="alignR">€4.30</td>
</tr>
<tr class="bg1">
<td><span class="dotted" id="sharpTip">Sharpe Ratio:</span></td>
<td class="alignR">
0.00
</td>
</tr>
<tr>
<td><span class="dotted" id="zTip">Z-Score (Probability):</span></td>
<td class="alignR">
-31.21 (99.99%)
</td>
</tr>
<tr class="bg1">
<td><span class="dotted" id="expTip">Expectancy:</span></td>
<td class="alignR">3.7 Pips / €0.30</td>
</tr>
<tr>
<td><span class="dotted" id="ahprTip">AHPR:</span></td>
<td class="alignR">0.01%</td>
</tr>
<tr class="bg1">
<td><span class="dotted" id="ghprTip">GHPR:</span></td>
<td class="alignR">0.01%</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
I've tried without succeed: The below is the one I have tried it.
//*[#id="trades"]/tbody/tr/td[1]/table/tbody/tr[5]/td[2]
//*[#id="trades"]/tr/td[1]/table/tbody/tr[5]/td[2]
and many others.. ;-)

This XPath,
substring-before(//table[#id="trades"]
//td[.="Average Win:"]/following-sibling::td[1], " /")
will select
36.68 pips
as requested, and you should find it to be more robust than many alternatives. For example, the table structure can change substantially, and as long as the label and the relative positions of the two table cells remain the same, this XPath will continue to function.

i had to remove both "tbody"
//*[#id='trades']/tr/td/table/tr[4]/td[2]

Inner table content not aligned with outer table

I am creating a table inside another table. I have divided the columns to be the exact same ratio as the outer table. However, the columns are not aligned with outer table columns. Can anyone tell me what I am missing?
<html>
<div style="overflow:scroll;height:140px;width:100%;overflow:auto" style="background-color:black">
<table width="100%" style="padding:0; margin:0;" cellpadding="0">
<tr class="tbl_header" cellpadding="0">
<td width="3%">test1</td>
<td width="7%">test2</td>
<td width="3%">test3</td>
<td width="12%">test4</td>
<td width="7%">test5</td>
<td width="10%"test6</td>
<td width="7%">test7</td>
</tr>
<tr style="background-color:yellow">
<td colspan="7" style="background-color:yellow">
<div style="overflow:scroll;height:110px;width:100%;overflow:auto;border:none;background-color:green">
<table width="100%" style="border:none;background-color:red" cellpadding="0">
<tr class="even">
<td width="3%">2</td>
<td width="7%" class="tdAlign">Testing </td>
<td width="3%" class="tdAlign">Testing </td>
<td width="12%" class="tdAlign">Testing Testing Testing</td>
<td width="7%">Testing_1</td>
<td width="10%">Testing_2</td>
<td width="7%">Testing_3</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
</html>

When I inspect the table with chromes web kit. I see that the tables with 3% then they are supposed to be, because of the text length. U can fix this by adding table-layout: fixed to both your <table> elements.
If U want to use a table header I suggest using <th> (see here)

<html>
<div style="overflow:scroll;height:140px;width:100%;overflow:auto" style="background-color:black">
<table width="100%" style="padding:0; margin:0;" cellpadding="0">
<tr class="tbl_header" cellpadding="0">
<td width="3%">test1</td>
<td width="7%">test2</td>
<td width="3%">test3</td>
<td width="12%">test4</td>
<td width="7%">test5</td>
<td width="10%">test6</td>
<td width="7%">test7</td>
</tr>
<tr style="background-color:yellow">
<td colspan="7" style="background-color:yellow">
<div style="overflow:scroll;height:110px;width:100%;overflow:auto;border:none;background-color:green">
<table width="100%" style="border:none;background-color:red" cellpadding="0">
<tr class="even">
<td width="3%">2</td>
<td width="7%" class="tdAlign">Testing </td>
<td width="3%" class="tdAlign">Testing </td>
<td width="12%" class="tdAlign">Testing Testing Testing</td>
<td width="7%">Testing_1</td>
<td width="10%">Testing_2</td>
<td width="7%">Testing_3</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
</html>
Looks like you missed a closing tag for a <TD>(<td width="10%">test6</td>). Hope this helps. Let me know

Select Link after fetching label in front of it

I am writing a selenium java code and at a particular webpage i want to select a link from a group of links where each link has an emebeded text within a table. How can i select particular link at this situtation. for eg.
run title--text 1
run title--text 2
run title--text 3
how can select specific run link for a specific title text? the text is not a label rather it is just simple text on the webpage.
i am using the following code:
verify.text("text 1");
it will only verify the presence of text, it wont go towards the link as link of every execution is named RUN. so it will identify the corresponding run link? The HTML code for the above is:
<HTML>
<HEAD>
<TITLE>TEST</TITLE>
</HEAD>
<BODY>
<div align="center"><table class="module" width="630">
<tr>
<th class="banner" width="70">ACTION</th>
<th class="banner" width="560">REPORT TEMPLATE</th>
</tr>
<tr>
<td class="modulenav" width="70">
<table class="innermodule" width="100%">
<tr><td class="moduleNav"><a class="listingLink"
href="www.abc.com/">Run</a></td></tr>
<tr><td class="moduleNav"><a class="listingLink"
href="www.zxc.com">UnShare</a></td></tr>
</table>
</td>
<td>
<table class="innerModule" width="100%">
<tr>
<td class="label" width="70">Title</td>
<td width="490"><span class="listingHead">Incident Performance by Priority</span></td>
</tr>
<tr>
<td class="Label" width="70">Description</td>
<td class="listing"></td>
</tr>
<tr>
<td class="Label" width="70">Owner</td>
<td class="listing"> Software Engineer Tel: </td>
</tr>
<tr>
<td class="Label" width="70">Shared With</td>
<td class="listing">
Software Engineer Tel: <br>
</td>
</tr>
<tr>
<td class="label">Report Type</td>
<td class="listing">Performance by Priority</td>
</tr>
</table>
</td>
</tr>
<tr><td class="tableRuleNavy" colspan="2"></td></tr>
<tr>
<td class="modulenav" width="70">
<table class="innermodule" width="100%">
<tr><td class="moduleNav"><a class="listingLink"
href="www.abc.com">Run</a></td></tr>
<tr><td class="moduleNav"><a class="listingLink"
href="www.cxd.com">UnShare</a></td></tr>
</table>
</td>
<td>
<table class="innerModule" width="100%">
<tr>
<td class="label" width="70">Title</td>
<td width="490"><span class="listingHead">Incident Trend Analysis Report</span></td>
</tr>
<tr>
<td class="Label" width="70">Description</td>
<td class="listing"></td>
</tr>
<tr>
<td class="Label" width="70">Owner</td>
<td class="listing">Software Engineer Tel: </td>
</tr>
<tr>
<td class="Label" width="70">Shared With</td>
<td class="listing">
Software Engineer Tel: <br>
</td>
</tr>
<tr>
<td class="label">Report Type</td>
<td class="listing">Trend Analysis</td>
</tr>
</table>
</td>
</tr>
<tr><td class="tableRuleNavy" colspan="2"></td></tr>
<tr>
<td class="modulenav" width="70">
<table class="innermodule" width="100%">
<tr><td class="moduleNav"><a class="listingLink"
href="www.sdfds.com">Run</a></td></tr>
<tr><td class="moduleNav"><a class="listingLink"
href="www.asdg.com">UnShare</a></td></tr>
</table>
</DIV>
</td>
</BODY>
</HTML>

Get a list of web elements and iterate over them.
This is not tested
E.g.
List<WebElement> we = findElements(By.cssSelector("tr a"));
Iterator itor = we.iterator()
While(itor.hasNext()) {
WebElement we = itor.next();
if (we.getText().equals("your visible text")) {
we.click // click link
}
}

How do I get a table with 3 columns and the third colums only has 1<td> 100%

<html>
<body>
<table align="left" border="0" cellpadding="1" cellspacing="1" style="width: 1000px;">
<tbody>
<tr>
<td width="300">Hanrathsingel 14</td>
<td width="300">Home</td>
<td width="400" height="100%">This one has to take the full height of the table</td>
</tr>
<tr>
<td width="300">1252 AE Laren</td>
<td width="300">Wie zijn wij</td>
</tr>
<tr>
<td width="300">T. 035-6231419</td>
<td width="300">Informatie</td>
</tr>
<tr>
<td width="300">M. 06-21700357</td>
<td width="300">Algemene Voorwaarden</td>
</tr>
<tr>
<td width="300">laren#qualitysites4all.com</td>
<td width="300">Contact</td>
</tr>
</tbody>
</table>
</body>
</html>
How do I get the column to be 100% of the table height but the other columns must keep their height?
Because I want to put a widget in there but I have to work in my boss his cms and I am not allowed to make new divs :(

Try rowspan:
<table align="left" border="0" cellpadding="1" cellspacing="1" style="width: 1000px;">
<tbody>
<tr>
<td width="300">Hanrathsingel 14</td>
<td width="300">Home</td>
<td width="400" rowspan="5">This one has to take the full height of the table</td>
</tr>
<tr>
<td width="300">1252 AE Laren</td>
<td width="300">Wie zijn wij</td>
</tr>
<tr>
<td width="300">T. 035-6231419</td>
<td width="300">Informatie</td>
</tr>
<tr>
<td width="300">M. 06-21700357</td>
<td width="300">Algemene Voorwaarden</td>
</tr>
<tr>
<td width="300">laren#qualitysites4all.com</td>
<td width="300">Contact</td>
</tr>
</tbody>
</table>
Example

JSFiddle Example
Use rowspan="5" in that TD.
Rowspan attribute, tells your element to "get the height" of 5 rows in this case.
If you have dinamic content remember to update this value to the actual number of rows of your table.