HTML does not maintain formatting after using docx4j XHTMLImporterImpl - java

Im currently using XHTMLImporterImpl version 8.0 and docx4j 8.23
I have the current html, saving this to a file and viewing in a browser looks good but after using the conversion, we loose all formatting...any ideas??
<html>
<div>
<div id="divHfBody" style="display:table;border-collapse: collapse;">
<div id="divHfBody" style="display:table-row;">
<div id="divHfBody" style="display:table-cell;border: 1px solid #000000;width:5%;padding:3px;">CODE1</div>
<div id="divHfBody" style="display:table-cell;border: 1px solid #000000;width:80%;padding:3px;">DESC1</div>
<div id="divHfBody" style="display:table-cell;border: 1px solid #000000;width:10%;padding:3px;">1.234</div>
</div>
<div id="divHfBody" style="display:table-row;">
<div id="divHfBody" style="display:table-cell;border: 1px solid #000000;width:5%;padding:3px;">CODE2</div>
<div id="divHfBody" style="display:table-cell;border: 1px solid #000000;width:85%;padding:3px;">DESC 2</div>
<div id="divHfBody" style="display:table-cell;border: 1px solid #000000;width:10%;padding:3px;">2.0</div>
</div>
</div>
</div>
</html>
I then make the following call, but when I look at the word document that is produced after the save, I do not see the same format as in a browser. I only see a box on the other div. all divs shows as a new row..similar to the following
-------------------------------------------------------------
-CODE1 -
-DESC1 -
-1.234 -
-CODE2 -
-DESC2 -
-2.0 -
-------------------------------------------------------------
This is my conversion code
XHTMLImporterImpl importer = new XHTMLImporterImpl(wordMLPackage);
List<Object> pHtml = importer.convert(divHtml, null);

Your html displays a table, because you use the css styles display:table, display:table-row and display:table-cell to tell the browser to render your html as a table. However, docx4j has limits when it comes to interpreting css styles.
If you would use html tags instead of css styles to display the table, the conversion would work. In that case, the html you would feed to the docx4j importer would have to look similar to this:
<div>
<table id="divHfBody" style="border-collapse: collapse;">
<tr id="divHfBody">
<td id="divHfBody" style="border: 1px solid #000000;width:5%;padding:3px;">CODE1</td>
<td id="divHfBody" style="border: 1px solid #000000;width:80%;padding:3px;">DESC1</td>
<td id="divHfBody" style="border: 1px solid #000000;width:10%;padding:3px;">1.234</td>
</tr>
<tr id="divHfBody">
<td id="divHfBody" style="border: 1px solid #000000;width:5%;padding:3px;">CODE2</td>
<td id="divHfBody" style="border: 1px solid #000000;width:85%;padding:3px;">DESC 2</td>
<td id="divHfBody" style="border: 1px solid #000000;width:10%;padding:3px;">2.0</td>
</tr>
</table>
</div>

Related

How to add pdf inside a thymeleaf pdf using flying saucer

I am using java, thymeleaf and flying saucer to generate pdf. I need to add another pdf (by fetching from Aws S3).
I tried iFrame and Embed but it is not working, I am not getting the second pdf in my generated pdf file!
Please help me in finding some way to add the pdf inside of pdf using thymeleaf;
My code-
<body>
<div class="header">
<div style="float: right; color: #000971">
Logo</div>
</div>
<div style="">
<div style="text-align: center; padding-top: 15px; "><h1 style="color:#000971;"><span th:text="${Name}"></span></h1></div>
<div style="padding-top: 30px; margin-left: 50px">
<h1 style="color:darkcyan;"><u>Report:</u></h1>
<h1 style="color: darkcyan; margin-top: 250px">Report By: <br />
<span style="color:#000971;" th:text="${firstName}"></span> <span style="color:#000971;" th:text="${lastName}"></span></h1>
<!-- <h1 style="color: #006382;">Last Name: <span style="color:#6FB8D9;" th:text="${lastName}"></span></h1>-->
<br/>
<div id="lastContent" style="margin-top: 80px">
<h2 style="color: darkcyan">REPORT DATE:</h2>
<h2 style="color: #000971">Created Date: <span th:text="${createdTime}"></span></h2>
<h2 style="color: #000971">Last Updated Date: <span th:text="${lastUpdated}"></span></h2>
</div>
</div>
</div>
<div>
<iframe src="http://www.wright.edu/~david.wilson/eng3000/samplereport.pdf" style="width:100%;height:700px;"></iframe>
<embed src="./samplereport.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html" />
</div>
</body>

Select from combo box using selenium webdriver without select statement

Html:
<input size="24" autocomplete="off" id="P.Gender" name="P.Gender" class=" x-form-text x-form-field x-form-focus" style="width: 125px;" title="" type="text">
<div class="x-layer x-combo-list " id="ext-gen1943" style="position: absolute; z-index: 11000; visibility: visible; left: 377px; top: 232px; width: 148px; height: 60px; font-size: 12px;">
<div class="x-combo-list-inner" id="ext-gen1944" style="width: 148px; height: 60px;">
<div class="x-combo-list-item ">Unknown</div>
<div class="x-combo-list-item ">Male</div>
<div class="x-combo-list-item x-combo-selected">Female</div>
</div>
</div>
Question: How to select Male/Female/Unknown from above HTML using Selenium webdriver? There is no select class in HTML, so I am not able to use Select.
You can normally use xpath with contains for selecting male/female/unknowm. Otherwise you can ask your developers to add select tag for these dropdowns if they can make the changes.
Example: //div[contains(text(),'Male')]

How to select a text from table and click with selenium

In order page when I make a payment, I get the created payment listed in payments list page. The created payment will always list on the first row of the table. I want to know how to get a text “This is Project:
“ and also be able to click on it. Every payment has its own id in a row i.e. Here is the snipped of the table:
<div id="PAYMENT-CONTAINER" style="clear:both">
<div class="list-widget" id="PAYMENT-LIST">
<ul style="visibility: visible;" class="table">
<li id="393118">
<div class="no-expand col0" style="text-align: center; width: 31px;"><input type="checkbox" class="rowSelect" value="393118"></div>
<div class="no-expand col1" style="text-align: center; width: 57px;">
<span class="tag untagged">•••</span>
</div>
<div class="col2" style="text-align: center; width: 155px;">
07/28/2015
</div>
<div class="col3" style="width: 401px;">
5280 FAST PITCH
</div>
<div class="col4" style="width: 344px;">
This is Project:
</div>
<div class="col5" style="text-align: right; width: 213px;">
$25.00
</div>
<div class="col6" style="width: 188px;">
Stacey Smith
</div>
<div class="col7" style="width: 178px;">
In Process
</div>
</li>
<li id="393119">
<div class="no-expand col0" style="text-align: center; width: 31px;"><input type="checkbox" class="rowSelect" value="393119"></div>
<div class="no-expand col1" style="text-align: center; width: 57px;">
<span class="tag untagged">•••</span>
</div>
<div class="col2" style="text-align: center; width: 155px;">
07/28/2015
</div>
<div class="col3" style="width: 401px;">
5280 FAST PITCH
</div>
<div class="col4" style="width: 344px;">
Donations are for good cause
</div>
<div class="col5" style="text-align: right; width: 213px;">
$26.00
</div>
<div class="col6" style="width: 188px;">
Stacey Smith
</div>
<div class="col7" style="width: 178px;">
In Process
</div>
</li>
You can get the text WebElement by using below xpath:
//div[#class='col4']
or
//div[contains(text(),'This is project');
you can use any one of the xpath to find web element.
Something like this:
WebElement element = driver.findElement(By.xpath("//div[#class='col4']"));
//Print text
print(element.getText());
//Click on that element if it is clickable.
element.click();
Xpath selector for your case is: //div[contains(text(), 'This is Project:')]
. For example, if instance of webdriver is called like "driver", then code should be:
driver.findElement(By.xpath("//div[contains(text(), 'This is Project:')]")).click();
If your required text "This is Project:" always appears in first row, then you can try below xpath:-
//li[1]/div[#class='col4']
//to get text:-
driver.findElement(By.xpath("//li[1]/div[#class='col4']")).getText();
//to click on it:-
driver.findElement(By.xpath("//li[1]/div[#class='col4']")).click();

Selenium Webdriver - (Java) - working with HTML dialogs

Here is the situation:
Click on Import file button (this action will upload a file).
After file upload, then appears a popup (HTML popup). I used driver.switchTo().frame(1); to switch to that popup and click "Next" in that popup.
Clicking Next will navigate user to second step in that popup. Click process commission button in that second step of popup.
After clicking process commission button, then appears a new confirmation popup (HTML popup).
I am not able to click yes in that confirmation popup.
I tried using:
driver.switchTo().frame(0); - did not work
driver.switchTo().frame(1); - did not work
driver.switchTo().frame(2); - did not work
Please suggest any solution.
<form id="Form1" enctype="multipart/form-data" action="ProcessCommission.aspx?i=2115&pn=Manage+Commission&j=2345&prn=Process+Commission" method="post">
<iframe scrolling="no" frameborder="0" src="javascript:'<html></html>';" style="position: fixed; width: 400px; height: 100px; left: 431px; top: 53px; background-color: rgb(255, 255, 255); z-index: 3003;" tabindex="-1">
<div id="RadWindowWrapper_confirm1381733327500" class="RadWindow RadWindow_Windows7 rwNormalWindow rwTransparentWindow" style="width: 400px; height: 100px; position: absolute; transform: none; backface-visibility: visible; visibility: visible; left: 431px; top: 377px; z-index: 3003;" unselectable="on">
<table class="rwTable" cellspacing="0" cellpadding="0" style="height: 51px;">
<tbody>
<tr class="rwTitleRow">
<tr class="rwContentRow">
<td class="rwCorner rwBodyLeft"> </td>
<td class="rwWindowContent" valign="top">
<iframe frameborder="0" name="confirm1381733327500" src="javascript:'<html></html>';" style="width: 100%; height: 100%; border: 0px none; display: none;" tabindex="0">
<div id="confirm1381733327500_content">
<div class="rwDialogPopup">
<div class="rwDialogText">
<div>
<a class="rwPopupButton" href="javascript:void(0); "onclick="$find('confirm1381733327500').close(true);" tabindex="-1">
<span class="rwOuterSpan">
<span class="rwInnerSpan">Yes</span>
</span>
</a>
<a class="rwPopupButton" href="javascript:void(0);" onclick="$find('confirm1381733327500').close(false);" tabindex="-1">
<span class="rwOuterSpan">
<span class="rwInnerSpan">No</span>
</span>
dr.SwitchTo().Frame(dr.FindElement(By.TagName("iframe")));
dr.SwitchTo().DefaultContent();
dr.FindElement(By.XPath("your stuff goes here").Click();
dr.SwitchTo().DefaultContent();//switch back to default content of original page
Try this:
driver.switchto.frame(0)
driver.switchto.frame(confirm1381733327500)

AjaxJspTag is not defined

I'm trying to use AjaxTags, especially the htmlContent tag. The jsp looks as follow:
<%# page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%# taglib uri="http://ajaxtags.sourceforge.net/tags/ajaxtags" prefix="ajax"%>
<h1>HtmlContent Tag Demo</h1>
<div style="font-size: 90%; width: 650px;">
<p>The <code>ajax:htmlContent</code> tag fills a content area (e.g., DIV tag) with an HTML
fragment from another resource. You may find this tag useful for including blocks of information in
a sidebar when the user clicks a link or form field. This tag is a more simplified approach to the <code>ajax:portlet</code>
and <code>ajax:tabPanel</code> tags.</p>
<p>Shown below are three different ways of executing the AJAX event: link, radio button, and
select field.</p>
</div>
<h3>HtmlContent in Action</h3>
<div id="modelDescription" style="background-color: EAE9AF; width: 300px; height: 100px;"></div>
<div id="htmlContentForm">
<p>Select by ANCHOR link.</p>
<ul>
<li>Ford</li>
<li>Honda</li>
<li>Mazda</li>
</ul>
<form id="htmlContentForm">
<p>Select by RADIO option.</p>
<input type="radio" id="makeford" name="make" value="ford" class="contentRadio" /> <label
style="display: inline; cursor: pointer;" for="makeford">Ford</label><br />
<input type="radio" id="makehonda" name="make" value="honda" class="contentRadio" /> <label
style="display: inline; cursor: pointer;" for="makehonda">Honda</label><br />
<input type="radio" id="makemazda" name="make" value="mazda" class="contentRadio" /> <label
style="display: inline; cursor: pointer;" for="makemazda">Mazda</label><br />
<br />
<p>Select by SELECT option.</p>
<select id="selmake" name="selmake">
<option value="">Select one</option>
<option value="ford">Ford</option>
<option value="honda">Honda</option>
<option value="mazda">Mazda</option>
</select></form>
</div>
<div id="progressMsg" class="indicator" style="padding-top: 5px; display: none;">Loading...</div>
<div id="errorMsg"
style="display: none; border: 1px solid #e00; background-color: #fee; padding: 2px; margin-top: 8px; width: 300px; font: normal 12px Arial; color: #900"></div>
<ajax:htmlContent baseUrl="${contextPath}/htmlcontent.htm" sourceClass="contentLink" target="modelDescription"
parameters="make={ajaxParameter}" />
<ajax:htmlContent baseUrl="${contextPath}/htmlcontent.htm" sourceClass="contentRadio" target="modelDescription"
parameters="make={ajaxParameter}" />
<ajax:htmlContent baseUrl="${contextPath}/htmlcontent.htm" source="selmake" target="modelDescription"
parameters="make={selmake}" eventType="change" />
The htmlcontent.htm is produced by another jsp, which contains only "HalloText" as string, nothing else (no html tags or similar). And this page can be loaded in the browser.
When i load the first jsp, then i get following as output:
<h1>HtmlContent Tag Demo</h1>
<div style="font-size: 90%; width: 650px;">
<p>The <code>ajax:htmlContent</code> tag fills a content area (e.g., DIV tag) with an HTML
fragment from another resource. You may find this tag useful for including blocks of information in
a sidebar when the user clicks a link or form field. This tag is a more simplified approach to the <code>ajax:portlet</code>
and <code>ajax:tabPanel</code> tags.</p>
<p>Shown below are three different ways of executing the AJAX event: link, radio button, and
select field.</p>
</div>
<h3>HtmlContent in Action</h3>
<div id="modelDescription" style="background-color: EAE9AF; width: 300px; height: 100px;"></div>
<div id="htmlContentForm">
<p>Select by ANCHOR link.</p>
<ul>
<li>Ford</li>
<li>Honda</li>
<li>Mazda</li>
</ul>
<form id="htmlContentForm">
<p>Select by RADIO option.</p>
<input type="radio" id="makeford" name="make" value="ford" class="contentRadio" /> <label
style="display: inline; cursor: pointer;" for="makeford">Ford</label><br />
<input type="radio" id="makehonda" name="make" value="honda" class="contentRadio" /> <label
style="display: inline; cursor: pointer;" for="makehonda">Honda</label><br />
<input type="radio" id="makemazda" name="make" value="mazda" class="contentRadio" /> <label
style="display: inline; cursor: pointer;" for="makemazda">Mazda</label><br />
<br />
<p>Select by SELECT option.</p>
<select id="selmake" name="selmake">
<option value="">Select one</option>
<option value="ford">Ford</option>
<option value="honda">Honda</option>
<option value="mazda">Mazda</option>
</select></form>
</div>
<div id="progressMsg" class="indicator" style="padding-top: 5px; display: none;">Loading...</div>
<div id="errorMsg"
style="display: none; border: 1px solid #e00; background-color: #fee; padding: 2px; margin-top: 8px; width: 300px; font: normal 12px Arial; color: #900"></div>
<script type="text/javascript">new AjaxJspTag.HtmlContent({baseUrl: "/spring-mvc-hsqldb/htmlcontent.htm", parameters: "make={ajaxParameter}", sourceClass: "contentLink", target: "modelDescription"});</script>
<script type="text/javascript">new AjaxJspTag.HtmlContent({baseUrl: "/spring-mvc-hsqldb/htmlcontent.htm", parameters: "make={ajaxParameter}", sourceClass: "contentRadio", target: "modelDescription"});</script>
<script type="text/javascript">new AjaxJspTag.HtmlContent({baseUrl: "/spring-mvc-hsqldb/htmlcontent.htm", eventType: "change", parameters: "make={selmake}", source: "selmake", target: "modelDescription"});</script>
And firebug report 3 Errors:
AjaxJspTag is not defined <script type="text/javascript">new Aja...arget: "modelDescription"});</script> hello.htm (Zeile 46)
AjaxJspTag is not defined <script type="text/javascript">new Aja...arget: "modelDescription"});</script> hello.htm (Zeile 48)
AjaxJspTag is not defined <script type="text/javascript">new Aja...target: "modelDescription"});</script> hello.htm (Zeile 50)
Can someone give me a hint, what is wrong (what i'm doing wrong)?
This refers to the fact that there is no javascript library included containing definition of the class AjaxJspTag.
The libraries javascripts should be included as follows:
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous/scriptaculous.js"></script>
<script type="text/javascript" src="js/overlibmws/overlibmws.js"></script>
<script type="text/javascript" src="js/ajaxtags.js"></script>
I also recommend to check this page for reference: AjaxTags JavaScript-JSP Library
- QuickStart (You are especially interested in step 2. described there)

Categories