I want to be able to print the form without the web content. I can do this in HTML just fine by using CSS but when I place it in the form it won't work any help would be appreciated. Here is what I have done so far.

1. Created a Form and when they click submit the email is sent and then it takes you to the thank you page except that I modified it so that it displays the content that was entered in the previous page so that it looks like an application page.

2. On the second page I entered the css code in the components/com_rsform/front.css .print {visibility:visible;}, then in the thank you section that I modified I placed <div = "print"> (start of where its to print) and </div> (up to where it should print).

As I mentioned before I can do this just fine in HTML form but for some reason it wont work on RSForm. I placed the .print {visibility:visible;} in every CSS page I could find just in case but not go.

If anyone can help I would appreciate it.

---- RESOLUTION

---

1.
Change
index.php?option=com_rsform&formId=3&Itemid=99999

To
index2.php?option=com_rsform&formId=3&Itemid=99999

Adding the number 2 after index strips out the template. Which will allow you to print the form by itself.


So here is the entire Rundown of what I am doing.

1. Customer fills out the form.
2. When submited the email is sent in an Application format to both the admin and the client.
3. The next page is the thank you which is similar to what was emailed the fields are not complete and ready for print using the button that I inserted towards the bottom.

Here is the HTML code used in the thank you and sumbissions.

<TABLE style="FONT-SIZE: 12px" class=mceItemTable border=0 width="90%" align=center mce_style="font-size:12px;">
<TBODY>
<TR>
<TD colSpan=5>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR>
<TD style="COLOR: #000000; FONT-SIZE: 18px" align=middle mce_style="font-size:18px; color:#000000">
<DIV align=center>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR>
<TD align=middle>
<DIV style="FONT-SIZE: 18px" align=center mce_style="font-size:18px"><STRONG> Payment Authorization Agreement</STRONG></DIV></TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR><BR>
<TD align=left></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR><BR>
<TD style="COLOR: #000000; FONT-SIZE: 16px; FONT-WEIGHT: bold" align=left mce_style="font-size:16px; font-weight:bold; color:#000000">DriversClub™ Membership<SPAN id=component17></SPAN></TD></TR>
<TR>
<TD style="COLOR: #000000" align=left mce_style="color:#000000"><BR>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer commodo nulla eget ipsum laoreet eget condimentum ante euismod. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent non sagittis metus. Proin in suscipit est. Vestibulum dignissim tortor eu justo tincidunt hendrerit. Aliquam a eros turpis. Praesent molestie odio at nibh fermentum sit amet eleifend neque tincidunt. Donec ornare, est non sagittis malesuada, mauris leo interdum dui, quis dignissim lacus velit vitae ligula. Vivamus enim justo, lobortis in accumsan non, vulputate eu lorem. Quisque sit amet nisl et lorem hendrerit sodales non nec turpis. Nunc mi dui, egestas eu congue in, porta mattis felis. <BR>
<BR></TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerName:caption}: </STRONG>{dealerName:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerNumber:caption}: </STRONG>{dealerNumber:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerAddress:caption}: </STRONG>{dealerAddress:value}</TD></TR>
<TR>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerCity:caption}: </STRONG>{dealerCity:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerState:caption}: </STRONG>{dealerState:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerZip:caption}: </STRONG>{dealerZip:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerPhone:caption}: </STRONG>{dealerPhone:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{dealerFax:caption}:</STRONG> {dealerFax:value}</TD></TR>
<TR>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{vehicleYear:caption}: </STRONG>{vehicleYear:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{vehicleMake:caption}: </STRONG>{vehicleMake:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{vehicleModel:caption}: </STRONG>{vehicleModel:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{vehicleCondition:caption}: </STRONG>{vehicleCondition:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{vin:caption}: </STRONG>{vin:value}</TD></TR>
<TR>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{odometerReading:caption}: </STRONG>{odometerReading:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{readingSelection:caption}: </STRONG>{readingSelection:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{pCode:caption}: </STRONG>{pCode:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><STRONG>{plan:caption}: </STRONG>{plan:value}</TD>
<TD></TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="COLOR: #000000"><STRONG mce_style="COLOR: #000000">{dealerEmail:caption}: </STRONG>{dealerEmail:value}</TD>
<TD style="COLOR: #000000" mce_style="COLOR: #000000"><STRONG mce_style="COLOR: #000000">{productNo:caption}: </STRONG>{productNo:value}</TD>
<TD></TD>
<TD></TD>
<TD></TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR>
<TD style="COLOR: #000000; FONT-SIZE: 16px; FONT-WEIGHT: bold" align=left mce_style="font-size:16px; font-weight:bold; color:#000000"><BR>CREDIT/DEBIT CARD INFORMATION<SPAN id=component38></SPAN></TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><BR><STRONG>{firstName:caption}:</STRONG> {firstName:value}</TD>
<TD style="COLOR: #000000" vAlign=bottom width="20%" mce_style="color:#000000"><STRONG>{middleName:caption}: </STRONG>{middleName:value}</TD>
<TD style="COLOR: #000000" vAlign=bottom width="20%" mce_style="color:#000000"><STRONG>{lastName:caption}: </STRONG>{lastName:value}</TD>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"></TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="color:#000000">{address:caption}:{address:value}<BR></TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{city:caption}: </STRONG>{city:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{state:caption}: </STRONG>{state:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{zip:caption}: </STRONG>{zip:value}</TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{phone:caption}:</STRONG> {phone:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{mobile:caption}:</STRONG> {mobile:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{email:caption}: </STRONG>{email:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"></TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{cdNumber:caption}:</STRONG> {cdNumber:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{ccExp:caption}:</STRONG> {ccExp:value}</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{ccvNumber:caption}: </STRONG>{ccvNumber:value}<BR></TD>
<TD></TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR vAlign=bottom>
<TD style="COLOR: #000000; FONT-SIZE: 16px; FONT-WEIGHT: bold" colSpan=2 align=left mce_style="font-size:16px; font-weight:bold; color:#000000"><BR>ISSUING BANK ACCOUNT INFORMATION<SPAN id=component52></SPAN></TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="color:#000000"><BR><STRONG>{metaBank:caption}:</STRONG> {metaBank:value}<BR></TD>
<TD style="COLOR: #000000" vAlign=bottom mce_style="color:#000000"><STRONG>{accNumber:caption}:</STRONG> {accNumber:value}</TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="color:#000000"><SPAN style="COLOR: #000000; FONT-SIZE: 16px; FONT-WEIGHT: bold" mce_style="COLOR: #000000; FONT-SIZE: 16px; FONT-WEIGHT: bold"><BR>Authorized Signature<BR><BR></SPAN></TD></TR>
<TR>
<TD style="COLOR: #000000" mce_style="color:#000000">____________________________<BR>Signature</TD>
<TD style="COLOR: #000000" mce_style="color:#000000"><STRONG>{signatureDate:caption}: </STRONG>{signatureDate:value}</TD></TR></TBODY></TABLE>
<TABLE class=mceItemTable border=0 width="100%">
<TBODY>
<TR>
<TD colSpan=3>
<DIV style="COLOR: #000000; FONT-SIZE: 18px" align=center mce_style="font-size:18px;"><STRONG><BR>Membership Agreement</STRONG></DIV></TD></TR>
<TR>
<TD colSpan=3>
<DIV align=center><IMG src="images/image.jpg" width="700" height="200" mce_src="gtechnologydesign.com/motor/images/agree.jpg"></DIV></TD></TR>
<TR>
<TD style="COLOR: #000000" colSpan=3 mce_style="color:#000000"><BR>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer commodo nulla eget ipsum laoreet eget condimentum ante euismod. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent non sagittis metus. Proin in suscipit est. Vestibulum dignissim tortor eu justo tincidunt hendrerit. Aliquam a eros turpis. Praesent molestie odio at nibh fermentum sit amet eleifend neque tincidunt. Donec ornare, est non sagittis malesuada, mauris leo interdum dui, quis dignissim lacus velit vitae ligula. Vivamus enim justo, lobortis in accumsan non, vulputate eu lorem. Quisque sit amet nisl et lorem hendrerit sodales non nec turpis. Nunc mi dui, egestas eu congue in, porta mattis felis. </TD>
</TR>
<TR>
<TD style="COLOR: #000000" width="20%" mce_style="color:#000000"><BR><STRONG>{producerNo:caption}:</STRONG> {producerNo:value}</TD>
<TD style="COLOR: #000000" vAlign=bottom width="18%" mce_style="COLOR: #000000"><STRONG>{planCode:caption}:</STRONG> {planCode:value}</TD>
<TD style="COLOR: #000000" vAlign=bottom width="62%" mce_style="COLOR: #000000"><STRONG>{maxCoverage:caption}:</STRONG> {maxCoverage:value}</TD></TR>
<TR>
<TD style="COLOR: #000000" colSpan=3 mce_style="color:#000000">
<P><BR>
</P>
<P> </P>
<P align=center><INPUT onClick="window.print();return false;" value=" Print this page " type=button></P>
<P> </P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>


Hope this helps someone else. I recommend you use Dreamweaver to view and edit the form it just makes life much easier.

Hello,

You can try placing the respective CSS code in the Form Layout tab of your form. Also any modifications to fields or text can be added either in the Form Layout or in the Additional Attributes box of each field.

I noticed that in the thank you, user and admin part where you can add HTML the CSS tags get stripped out. For example <div class="test"> gets changed to <div class=test> when saved. The problem with this is that the CSS no longer works because of the change. Therefore I had to use the resolution I had to come up with. However, it would be nice to get it working without stripping the template.