Skip to main content
Participating Frequently
February 27, 2022
Answered

Generating Word Document with alignment

  • February 27, 2022
  • 1 reply
  • 2251 views

Hi,

 

I am using ColdFusion 2018. I am printing a word document (dynamic) using the below code. But there are multiple issues. One is that the image (please refer screenshot) is not aligned.  I want the image to be placed on top on extreme left and top (topmargin=0 and leftmargin=0).  Also after the image i am placing a text which is not displayed in the generated word document.  Please help.  If there is a better way to generate word document in coldfusion please post that too.  

 

<html>
<head><style> body { margin:0; } </style></head>
<body>
<img src="https://www.getinge-training.com/images/TopHeader.jpg" width="1429" height="496" border="0">
</body>
<cfheader name="content-disposition" VALUE="attachment; filename=1.doc">
<cfoutput>
<table border="0" cellpadding="0" cellspacing="0">
<cfset type="application/msword">
<tr>
<td><img src="https://www.getinge-training.com/images/TopHeader.jpg" width="1429" height="496" border="0"></td>
</tr>
<tr>
<td>PERSON NAME</td>
</tr>
</table>
</cfoutput>
</body>
</html>

    This topic has been closed for replies.
    Correct answer BKBK

    I managed to print the content in word using the below code.  Still there is whitespace on top and left which i wanted to avod (please see screenshot).  Please reply if anyone can help.  

     

    <CFQUERY NAME="reg" datasource="#client.datasource#">
    SELECT first_name,last_name,credential FROM registration
    WHERE registration_id = #url.id#
    </CFQUERY>
    <CFQUERY NAME="req" datasource="#client.datasource#">
    select city,state from evh_request where event_id=#url.eventid#
    </CFQUERY>
    <html>
    <head>
    <title>Certificate</title>
    <style>
    body { margin:0; margin-left: 0px;margin-top: 0px;}
    .normaltxt { font-family: Arial, Helvetica, Sans-serif;font-size: 25px; border: none;FONT-WEIGHT: normal; }
    .namebold { font-family: Arial Black, Helvetica, Sans-serif;font-size: 52px; border: none;FONT-WEIGHT: bold;}
    .boldtxt { font-family: Arial Black, Helvetica, Sans-serif;font-size: 28px; border: none;FONT-WEIGHT: bold; }
    </style>
    </head>
    <body>
    <cfheader name="content-disposition" VALUE="attachment; filename=1.doc">
    <cfset type="application/msword">
    <table border=0 cellspacing=0 cellpadding=0 width=200>
    <tr><td><img src="https://www.getinge-training.com/images/TopHeader.jpg" width="630" height="220" border="0"></td></tr>
    <tr><td></td></tr><tr>
    <td align=center height=140 valign=middle><font class="normaltxt">This certificate is to confirm</font>
    </td></tr>
    <tr><td align=center height=180 valign=middle><font class="namebold"><cfoutput>#reg.first_name# #reg.last_name# #reg.credential#</cfoutput></font></td></tr>
    <tr><td align=center height=120 valign=top><font class="normaltxt">attended a didactic presentation and<br>received cadaver laboratory training on<br>Endoscopic Vessel Harvesting utilizing the<br><br></font></td></tr>
    <tr><td align=center height=130 valign=middle><font class="boldtxt">Vasoview&#174; Endoscopic Vessel Harvesting System<font></td></tr>
    <tr><td align=center height=150 valign=middle><font class="normaltxt"><cfoutput>#DateFormat(Now(),"mmmm d, yyyy")#</cfoutput><br><cfoutput>#req.City#, #req.state#</cfoutput><br></td></tr>
    <tr> <td align=left height=60 valign=bottom> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="https://www.getinge-training.com/images/signature.jpg" width="345" height="110" border="0"></td> </tr>
    </table>
    </body>
    </html>


    @Sandhya231275905kpl , l shall say it again: all of these attempts (with an HTML table, cfheader with Word Content-Disposition, styles, etc.) will NOT produce the display you want. It is well-nigh impossible for the margins that you set in HTML to carry over to MS Word.

     

    Imagine you wish to frame a picture. Obviously, the dimensions and aspect-ratio of the frame and mat board will be the factors that determine how well your picture will fit.

    You may be able to adapt the picture's dimensions. But there is a limit to how the picture can affect the mat board and frame. In fact, the frame is fixed and determines the required size and aspect ratio of the picture, not vice versa.

     

    This analogy carries over to your code. The HTML output corresponds to the picture, with or without mat board.  MS Word (independent software unrelated to CF) supplies the fixed frame. MS Word may supply headers, footers or margins that you cannot anticipate in the HTML. 

     

    What your HTML code is doing is, simply, streaming HTML output to the browser. The Content-Disposition header tells the browser to offer the content as a downloadable MS Word file rather than display it inline.

     

    That's it. Just as the picture in our frame analogy has limited influence on the dimensions of the frame and mat board, so too HTML has limited influence on the footers, headers, margins, styling, etc. that MS Word may impose.

     

    What to do then?

     

    Your best bet is to avoid the table tag. Use divs instead.

    A simple example to demonstrate:

     

    <html>
    <head>
    <cfheader name="content-disposition" value="attachment; filename=1.doc">
    </head>
    <body style="margin-top: 0in">
    <div style="margin-left:-1.0in;margin-right:-1.0in;">
    	<img src="http://localhost:8500/workspace/CF_Project/TopHeader.jpg" border="0" width="1429" height="496" style="max-width:100%;">
    </div>
    </body>
    </html>
    

     

    1. Open the downloaded file 1.doc in MS Word.
    2.  Click on Page Layout, then on Margins.
    3.  Click on Custom Margins, select 0 as Top margin and press OK.
    4.  Examine the Print Preview and you will see that the image is at the top margin of the page.

       

    1 reply

    BKBK
    Community Expert
    February 27, 2022

    ColdFusion is irrelevant to your question, as your script contains no ColdFusion code. Ignoring cfheader, your script is basically HTML. So you should sort out the alignment in HTML first, preferably before any ColdFusion intervention.

     

    For a start, the HTML is confusing. Reasons:

    1. One <body> tag, but two </body> tags;
    2.  It is unclear whether the table is within or outside the HTML body. 
    3. The same <img> tag occurs twice for no apparent reason;
    4.  Use of the cfoutput tag is unnecessary.
    Participating Frequently
    February 27, 2022

    Hello,

     

    I am pasting the updated code below.  As you mentioned that ColdFusion is irrelevent, same way those errors are irrelevent as it will not make any difference to the code.  I hope you understood the solution that i am looking for (thanks for spending some time to find some mistakes in my dirty code through).  I hope anybody who look at the screenshot will know what i am looking for.   To make you happy I added some coldfusion code even then it is the same result.  Please help only if you understood the requirement, else do not comment so that it will leave it open for others to give some suggestions that i am looking for. 

     

    <CFQUERY NAME="getreg" datasource="#client.datasource#">
    SELECT fname,lname FROM reg WHERE reg_id = 39027
    </CFQUERY>
    <html>
    <head>
    <style> body { margin:0; } </style>
    </head>
    <body topmargin=0 leftmargin=0>
    <cfheader name="content-disposition" VALUE="attachment; filename=1.doc">
    <cfoutput>
    <table border="0" cellpadding="0" cellspacing="0">
    <cfset type="application/msword">
    <tr>
    <td><img src="https://www.getinge-training.com/images/TopHeader.jpg" width="1429" height="496" border="0"></td>
    </tr>
    <tr>
    <td>#getreg.fname#</td>
    </tr>
    </table>
    </cfoutput>
    </body>
    </html>

    BKBK
    Community Expert
    February 27, 2022

    As you mentioned that ColdFusion is irrelevent, same way those errors are irrelevent as it will not make any difference to the code.  


    By @Sandhya231275905kpl

     

    I would disagree. HTML is tolerant and flexible. If you make a mistake in HTML, browsers will likely ignore them and display the page in the best way they can.

     

    I tested your script as follows:

    1) I created a 1429 px by 496 px copy of your image and placed it in the same directory as the test CFM page.

    2) I created  test.cfm, which contains:

    <html>
    <head>
    <style> body { margin:0; } </style>
    </head>
    <body topmargin=0 leftmargin=0>
    <cfheader name="content-disposition" VALUE="attachment; filename=1.doc">
    <cfoutput>
    <table border="0" cellpadding="0" cellspacing="0">
    <cfset type="application/msword">
    <tr>
    <td><img src="http://localhost:8500/workspace/CF_Project/TopHeader.jpg" width="1429" height="496" border="0"></td>
    </tr>
    <tr>
    <td>&nbsp;</td>
    </tr>
    </table>
    </cfoutput>
    </body>
    </html>
    

     

    3) I ran test.cfm. The result is a Word page in which the image is located in the top-left corner. (image of result attached)