Saving page as PDF or as HTML but with all entries

Hello every one :)

I wont to create a pdf from a form on my page, but the Problem is, I need it excactly like the page with form, all entires.

So I have for example

2 Input Fields, 7 Radio, 2 Checkboxes, and as result i need a PDF with the same sructure, but if someone check the checkbox, it must be saved in pdf.

I have tryed to save the html content of the page on submit, and save it first in html file, but the problem is, my selections woundn't be saved.

The result must have the same as i would print my form.

I hope someone can help.

The Code i using to save the page content.

> $(document).ready(function(){
>       $('input[type=submit]').click( function()   {           
> var formname = $("body").find("form").attr("name");
> var htmldata = $("form[name="+formname+"]").html();
> var enchtmldata = ncodeURIComponent(htmldata);
> $.ajax({  
> type: "post",             
> data: "data="+enchtmldata,
> url: "makepdf.php",           
> success: function()
>   {
>   alert("success");           },
> error: function()             {
>   alert("error");             }           });
> 
> }); });

PS: I using PHP and jQuery

ADDED: I think it is better to try first of all to save the form page as html, but to keep the entries in it. After that to try to convert it. But the Problem is, to save it with all data.

ADDED: how can I add a attr selected to an option field?

From stackoverflow

• Run this in your browser's javascript command line, copy-paste the result to text editor and save as html file.

  $('body').text($('html').html())
  

  Depending on your browser, this may also work when copy-pasted to address bar:

  javascript:$('body').text($('html').html())
  

  The output is "dynamic" page source, i.e. DOM tree rendered into text.

  Fincha : The Problem is, if I have writen somethink in the field, it wouldn't be saved by using .html() or .text() ... the same is with checkboxes :(

  jholster : You are right, my suggestion doesn't work.

• What do you use to convert the HTML to PDF? I can recommend TCPDF for that job: http://www.tecnick.com/public/code/cp_dpage.php?aiocp_dp=tcpdf

  It can convert HTML with CSS to a PDF form. I haven't tested it myself but I am quite sure that it will even keep the checked option. But for sure you have to create the HTML with PHP to have the checkbox checked.

  <input type="checkbox"<?php echo ($_REQUEST['checkbox_name'])? ' checked="checked"' : '' ?> />
  

  You should than be able to create the correct PDF form with the TCPDF Class.

  Fincha : Hm, this class is very usefull. But first of all, I need to save the html page ast, txt or thml this all inputs and after that, convert it. I using this jquery code, but all i get, is the form without entries

  Kau-Boy : But if you sent the form to itself and that add all the values in the $_REQUEST array to the value attributes of input and textare and select/check all other elements, you'll get the correct form state in the HTML source. Or just try my new suggestion.

  Fincha : hm, i will try it now

  Fincha : I have a problem to do this, a can't change forms :/

  Kau-Boy : You don't have access to the form source code? That's bad. Could you duplicate the form source code as a PDF template and add the form data to that template? That might make it a lot easier.

• Ok, I think the problem ist, that checking a checkbox in the browser doesn't change the HTML source. So if you want to transfer the HTML via AJAX, you have to "convert" the checked state within the browser to a real source checked state.

  I am not an jQuery expert, but you shoul select all input[type="checkbox"] and test if they are checked. If they are, add an attribute "checked" with the value "checked" to the checkbox. Otherwise remove the checked attribute if it is present.

  The source HTML will than have all the correct checked states. Without this method you might get some the checkboxe that have been preselected with PHP but have been deselected by the user.

  I hope my answer was clear enough, sorry for my english :)

  Fincha : yes that it the problem, i will try to do this

  Fincha : $(this).attr("value", $(this).val()); doesn't works

  Kau-Boy : As I already mentioned, my jQeury knowledge is limited to the basics. I could give you a solution with Prototype. But that's what you have to do: select all input, textarea and select elements. For alls input that are not checkboxes or radio buttons, set the value attribute. For checkboxes and radio buttons and selects check for the "checked" or "selected" state and add a checked or selected attribute to them. For textareas append the value as a text child node to the textarea. But how to solve that with jQuery you might have to ask a jQuery expert.

• Have you tried placing the page as a background with the variables as conditional overlays? I have achieved this in the past using FPDF. Radio buttons can be placed as an image ontop of the existing screen dump. You will have no problem putting the text in the right place also.

• Is there any reason you can't just take the form data and send it to a sever process that will store the form data in a database? From there it should be a relatively simple process to populate the HTML form and generate a PDF form from the database.

  Fincha : sorry, no way :(