Issue of table break in outlook 2010 - email

I have strange issue in my email when it is viewed in outlook 2010.
The source for the email is as follows,
<html>
<head>
<title>Testing</title>
</head>
<body style="background:green;border:100px solid red">
<table style="border:20px solid blue; width:600px;" align="center">
<tr>
<td>
</td>
</tr>
<tr>
<td style="background:#DDD;">
<span>0</span><br /><span>1</span><br /><span>2</span><br /><span>3</span><br /><span>4</span><br /><span>5</span><br /><span>6</span><br /><span>7</span><br /><span>8</span><br /><span>9</span><br /><span>10</span><br
/><span>11</span><br /><span>12</span><br /><span>13</span><br /><span>14</span><br /><span>15</span><br /><span>16</span><br /><span>17</span><br /><span>18</span><br /><span>19</span><br /><span>20</span><br /><span>21</span><br /><span>22</span><br /><span>23</span><br /><span>24</span><br
/><span>25</span><br /><span>26</span><br /><span>27</span><br /><span>28</span><br /><span>29</span><br /><span>30</span><br /><span>31</span><br /><span>32</span><br /><span>33</span><br /><span>34</span><br /><span>35</span><br /><span>36</span><br /><span>37</span><br /><span>38</span><br
/><span>39</span><br /><span>40</span><br /><span>41</span><br /><span>42</span><br /><span>43</span><br /><span>44</span><br /><span>45</span><br /><span>46</span><br /><span>47</span><br /><span>48</span><br /><span>49</span><br /><span>50</span><br /><span>51</span><br /><span>52</span><br
/><span>53</span><br /><span>54</span><br /><span>55</span><br /><span>56</span><br /><span>57</span><br /><span>58</span><br /><span>59</span><br /><span>60</span><br /><span>61</span><br /><span>62</span><br /><span>63</span><br /><span>64</span><br /><span>65</span><br /><span>66</span><br
/><span>67</span><br /><span>68</span><br /><span>69</span><br /><span>70</span><br /><span>71</span><br /><span>72</span><br /><span>73</span><br /><span>74</span><br /><span>75</span><br /><span>76</span><br /><span>77</span><br /><span>78</span><br /><span>79</span><br /><span>80</span><br
/><span>81</span><br /><span>82</span><span>85</span><br /><span>86</span><br /><span>87</span><br /><span>88</span><br /><span>89</span><br /><span>90</span><br /><span>91</span><br /><span>92</span><br /><span>93</span><br /><span>94</span><br /><span>95</span><br /><span>96</span><br
/><span>97</span><br /><span>98</span><br /><span>99</span><br /><span>100</span>
</td>
</tr>
</table>
</body>
</html>
And the email looks in outlook 2010 is as follows,
http://postimg.org/image/dpinwd9l7
In the image, you can see there is breaking of table and also border is breaked. I don't know why it is happening.
Please help me to get rid of this issue.

I think what is happening it that you are over 1800px in a single column.
You can read more about it here:
The best answer is to break it up into two tables stacked on top of each other.

Related

GetVMImageUrl doesn't work when Overriding

I want to override in a ViewModel the way is showed a picture.
According to the DevelopmentView:
Picture for foto2
<div ng-show="ViewModelRoot.VM_Status.vmEditAlumno_foto2_Visible">
<table>
<thead>
</thead><tbody>
<tr>
<img ng-src="{{StreamingViewModelClient.GetVMImageUrl(ViewModelRoot.Curr_vmEditAlumno(), "foto2")}}" img-responsive class="vmImage" />
</tr><tr>
<input type="file" onchange="angular.element(this).scope().onFileSelect('vmEditAlumno.foto2', angular.element(this).scope().ViewModelRoot.Curr_vmEditAlumno().VMClassId)" id="vmEditAlumno.foto2" ng-show="ViewModelRoot.VM_Status.vmEditAlumno_foto2_Enabled" />
</tr>
</tbody>
</table>
</div>
I set "Content Override" in the column and create a AngularUIOverride tag with value "Foto2Alumno.cshtml".
Not it gets the new file "Foto2Alumno.cshtml", as if I change something in that file it is showed, but the picture from the command GetVMImageUrl
isn't show
What am I missing?
Thanks
It was a problem with double quotes ("). I changed them to single quote (') and now the image is shown.
Wrong:
GetVMImageUrl(ViewModelRoot.Curr_vmEditAlumno(), "foto2")
Right:
GetVMImageUrl(ViewModelRoot.Curr_vmEditAlumno(), 'foto2')

Selenium IDE Click on a button in a row identified by text

I am trying to get my script to click on a button called Enter Response located in the same row as a specific text (SID). I am able to locate both separately but can't seem to make both work at the same time.
The table is dynamic so I am using the SID, finding it's row and then want to click on it's response button. I.E. find text '123456' & click on 'Enter Response' found in the same row.
I tried this but am getting an error locator not found:
//tr/td/a[#class='title-abbr' and text()='123456']/following-sibling::td/a[text()='Enter Response']
Table Row Headers:
Title/Source/Source ID/SID/Create Date/(Enter Response button)/Form Type
<tr>
<td class="t-Report-cell" headers="TITLE_ABBR">this is my title</td>
<td class="t-Report-cell" headers="SOURCE_NAME">source1</td>
<td class="t-Report-cell" headers="SOURCE_NUMBER">142417</td>
<td style="background-color: rgb(13, 13, 13);" class="t-Report-cell" headers="SID_ABBR">
123456
</td>
<td class="t-Report-cell" headers="TRANSACTION_DATE">07/28/2016</td>
<td style="background-color: rgb(13, 13, 13);" class="t-Report-cell" headers="LINK" align="center">
<a style="background-color: rgb(0, 255, 255);" class="response-btn" href="f?p=58117:50:27077013481519::NO::P50_TRIGGER_ID:321860">Enter Response</a>
</td>
<td class="t-Report-cell" headers="FORM_TYPE">Questions</td>
</tr>
Any help would be greatly appreciated!
if I am looking right, you should first get to the parent node before trying to get to the next sibling....because "a" element has no sibling, so basically something like that:
//tr/td/a[#class='title-abbr' and text()='123456']/../following-sibling::td/a[text()='Enter Response']
You could also just use following-sibling::td[2] instead of selecting by text in the second part of xpath, but maybe you need it for some reason.
Btw some tips:
If the element could have multiple style classes, you will have to use contains
The same applies to text, beware of spaces etc. you should trim the text or use contains to avoid wrong selectors

Selenium Webdriver_Not able to click on link given into column

I'm a beginner and I'm trying to write a Selenium web driver. I'm using eclipse and trying to locate a link available in next column. In each row I have different link. For example in my employee data table I have 2 columns and 10 rows in one page. The first column contains the name of person and second column contains its employee ID (ID is a hyperlink). I'm trying to select the hyperlink of any employee but I'm not able to do it.
I have below the HTML code and sample script.
<span id="37">
<div class="clear"></div>
<div id="FC_Schema.1021.WIP" type="DataCheckingList" name="FC_Schema.1021.WIP">
<input id="baseurl" type="hidden" value="/Web/" name="baseurl">
<input id="hdnDcCnt" type="hidden" value="13" name="hdnDcCnt">
<input id="PageNo" type="hidden" value="1" name="PageNo">
<meta content="width=device-width" name="viewport">
<style type="text/css">
<div id="DataCheckingLoad">
<div id="SupplyChainTabs">
<div id="gbo" class="InnerAlertsTabs">
<table id="one" class="draggable" width="100%">
<thead>
<tbody>
<tr>
<td valign="top" align="center">
<td valign="top">
<td valign="top">
<a onclick="return ButtonClick(this,'TxnyD.Communities.2.1','Org.2000476_Product.THQS|SMS|Questionnaire.WIP_Questionnaire_TxnyD.Communities.2.1_THQS_TxnyD.Operationaloffice.1.2');" href="#f">Axiom
Process LLC</a>
<div class="country-name">
<div class="CompanyInfoContactLinks">
</td>
<td valign="top">
THQS
<div class="clear"> </div>
<a id="Org.2000476_Product.THQS|SMS|Questionnaire.WIP_Questionnaire_TxnyD.Communities.2.1_THQS_TxnyD.Operationaloffice.1.2" onclick="RedirectToQuestionnairePage(id)" href="#">THQS</a>
<div class="clear"> </div>
</td>
In the above code first column contains company name i.e "Axiom
Process LLC" and second column contains company subcription name i.e."THQS". I have to select the THQS link of company "Axiom Process LLC"
Selenium script designed for it as below
public static void main(String[] args) throws Exception {
WebDriver driver = new FirefoxDriver();
driver.manage().window().maximize();
driver.get("http://XXX.XXX.XXX.XXX/Web");
Thread.sleep(1000);
driver.findElement(By.xpath("//input[#id='UserName']")).sendKeys("Gbouser.1");
driver.findElement(By.xpath("//input[#id='Password']")).sendKeys("****");
driver.findElement(By.xpath("//input[#name='Login']")).click();
driver.findElement(By.xpath("//a[contains(text(),'Task')]")).click();
driver.findElement(By.xpath("//a[contains(text(),'Data Checking')]")).click();
driver.findElement(By.partialLinkText("Axiom")).findElement(By.xpath("//a[contains(text(),'THQS')]")).click();
}
So basically these are dynamic tables and each time it will have different records. How can select the link available in column?
I also tried below script as well:
driver.findElement(By.name("*[id^='CLS'][id$='Demolition Limited']")).findElement(By.xpath("//a[contains(text(),'THQS')])[3]")).click();
welcome to Stackoverflow. Before answering your question, just a few pointers. Think that you had a downvote 'cause you didn't format your question well. Otherwise a perfectly legal question, and you would receive help much earlier.
Secondly, don't ever put the real Web site address, username and password :). I was able to login, and understand exactly what you need, but a malicious guy could do bad wonders there.
To answer your question, instead of the line that is causing you problems, try this
Thread.sleep(3000);
TablePageObject tablePageObject = PageFactory.initElements(driver, TablePageObject.class);
tablePageObject.clickLink("Axiom");
Where TablePageObject is
public class TablePageObject {
private WebDriver driver;
#FindBy(css = "table tr")
private List<WebElement> allTableRows; // find all the rows of the table
public TablePageObject(WebDriver driver) {
this.driver = driver;
}
public void clickLink(String companyName) {
for(WebElement row : allTableRows) {
List<WebElement> links = row.findElements(By.cssSelector("a"));
// the first link by row is the company name, the second is link to be clicked
if (links.get(0).getText().contains(companyName)) {
links.get(3).click();
}
}
}
}
An explanation, TablePageObject class will be your programmatic handle for the dynamic table you're trying to control. It follows a page factory pattern of selenium, which I heartly recommend, and you can learn more here https://code.google.com/p/selenium/wiki/PageFactory
It basically keeps a collection of rows of your table, which more or less looks like:
<tr>
<td valign="top" align="center">
// irelevant
</td>
<td valign="top">
// irelevant
</td>
<td valign="top">
<a>Axiom Process LLC</a>
<a>company details</a>
<a>web details</a>
</td>
<td valign="top">
<a>THQS</a>
</td>
<td valign="top" align="center" style="display: none">
// irelevant
</td>
<td valign="top">
//irelevant
</td>
<td valign="top">
// irelevant
</td>
<td valign="top">
</td>
<td>
</td>
</tr>
You collect all the links from the table, check the company name against the first link, and if matched, click the fourth link,
Hope it helps, best,
by the way, I've masked your password in the question

jquery onclick event not working on td

I am trying to trigger an event when I click on a td with class toggle. When I click on a td with class toggle, I want to show all the next tr with class hidethis.
But I cant seem to trigger an event on the td. Here's what I have got so far.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"> </script>
<script type="text/javascript">
$(document).ready(function () {
$(' td .toggle ').on('click',function(ev){
$(this).closest('tr').nextAll('tr .hidethis').show();
});
});
</script>
</head>
<body>
<table border="1">
<tr >
<td class="toggle">First Toggle</td>
</tr>
<tr class = "hidethis" style="display:none">
<td>Value 1</td>
<td>Value 2 </td>
<td>Value 3</td>
</tr>
<tr >
<td class="toggle">Second Toggle</td>
</tr>
<tr class = "hidethis" style="display:none">
<td>Value 4</td>
<td>Value 5 </td>
<td>Value 6</td>
</tr>
</table>
</body>
</html>
The problem is when I click on the td with class toggle the event is not firing.
Please help me. May be I am not seeing something obvious.
Thanks in advance.
Remove the space between the selectors, it has a specific meaning:
Selects all elements that are descendants of a given ancestor.
It should be:
$('td.toggle')
Remove space between td and toggle
$(' td .toggle ').on('click',function(ev){
to
$('td.toggle').on('click',function(ev){
^
and also same problem with your below code:-
$(this).closest('tr').nextAll('tr .hidethis').show();
to
$(this).closest('tr').nextAll('tr.hidethis').show();
^
Working Demo
Simply try like
$(document).ready(function () {
$('.toggle').on('click',function(ev){
$(this).closest('tr').nextAll('tr .hidethis').show();
});
});
Or remove the space between the td and its classname
$('td.toggle').on('click',function(ev){

Watir webdriver - How to click on dynamically generated last <td> in table?

In my application,I've to select the last td (which is an img) in table.Can anyone help me with this ?
HTML
<table>
<tbody>
<tr>
<td>
<td>
<a onclick="return confirm('Delete creative?')" href="delete.page?cid=47">
<a href="edit.page?id=47"><a href="?duplicateId=47">
<img title="Duplicate" src="/tracker/images/skin2/bolean.png">
</a>
</td>
</tr>
</tbody>
</table>
Implemenetd as below :
#browser.img(:src => "/tracker/images/skin2/bolean.png").click
#browser.img(:src => "/tracker/images/skin2/bolean.png").last.click
which is clicking on the first image.
When you do:
#browser.img(:src => "/tracker/images/skin2/bolean.png")
This returns the first matching element.
If you want to get all of the matching elements, you need to pluralize the method:
#browser.imgs(:src => "/tracker/images/skin2/bolean.png")
You will then get a collection of all images that have the specified src. You can then get the last one and click it similar to how Ċ½eljko did it for tds.
#browser.imgs(:src => "/tracker/images/skin2/bolean.png").last.click
Try this:
#browser.tds.last.click