www.webdeveloper.com
Results 1 to 13 of 13

Thread: Capturing the contents of input boxes

  1. #1
    Join Date
    Jan 2013
    Location
    Schoolcraft Michigan
    Posts
    6

    Capturing the contents of input boxes

    I am using the following code to dump the html code of a dynamic web page to a variable. I post the contents of the variable to the server and then using php, write the contents of the variable to a file. Later I append the header tag info specifing the style sheets used and then use wkhtmltopdf to convert the html file to a pdf file.

    function submitForm(){
    var el = document.getElementById("html");
    el.value = document.getElementById("htmlPDF").innerHTML;
    document.forms["innerForm"].submit();
    }

    <form id="innerForm" method="post" action="testPDF.php" target="_new">
    <input type="text" id="html" name="html" style="display:none" />
    <input type="button" value=">>>Print PDF" onclick="submitForm()" />
    </form>

    Everthing works perfectly except that some input text boxes are filled in with a javascrpt function. Because the 'value' of the box isn't in the value="###" attribute of the input tag, it doesn't get dumped to the file.

    My awkward solution is to first post the form, save the values as session variables and then when the page is written again, I can use the session variables to write the 'values' into the value="##" of the input tag. Don't want to do that unless absolutely necessary.......

    Am I missing something? Thanks

  2. #2
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    Maybe you also could set the 'defaultValue' property of the input as well as the 'value'? That should show in the html tag.
    New to web development or in need of a good reference? Check out the Mozilla Developer Network or W3Schools.

  3. #3
    Join Date
    Jan 2013
    Location
    Schoolcraft Michigan
    Posts
    6
    Won't help me. I need what the user enters into the box and also what javascript puts in the totals box.

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    what if you try [elem].attributes['value'].nodeValue?
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  5. #5
    Join Date
    Jan 2013
    Location
    Schoolcraft Michigan
    Posts
    6
    Thanks for the response....

    But I know just not quite enough to know where to put it in my submitForm script in order to capture the values and then have them saved in the HTML variable.

    Can you help me with that?

  6. #6
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    forget that nodeValue. as i understood you have a form and some text fields of that form are filled with javascript. i've made a page with such form and some fields of this form are filled the same way after clicking on the "Let JavaScript fill some text fields" button. then i've made a php file which outputs the $_POST array

    Code:
    <?php
    print_r($_POST);
    ?>
    every field value is sent and recieved you can see it here
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  7. #7
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Code:
    function submitForm(){
    var el = document.getElementById("html");
    el.setAttribute("value", document.getElementById("htmlPDF").innerHTML);
    //document.forms["innerForm"].submit();
     return false;
    }

  8. #8
    Join Date
    Jan 2013
    Location
    Schoolcraft Michigan
    Posts
    6
    I would love to see your example page. Did I miss where you said to 'see it here'?

  9. #9
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    'here' is the link to that page
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  10. #10
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    Quote Originally Posted by Padonak View Post
    'here' is the link to that page
    Hmm, links really need to have a more distinguishable color in this forum. :S
    New to web development or in need of a good reference? Check out the Mozilla Developer Network or W3Schools.

  11. #11
    Join Date
    Jan 2013
    Location
    Schoolcraft Michigan
    Posts
    6
    Quote Originally Posted by Padonak View Post
    forget that nodeValue. as i understood you have a form and some text fields of that form are filled with javascript. i've made a page with such form and some fields of this form are filled the same way after clicking on the "Let JavaScript fill some text fields" button. then i've made a php file which outputs the $_POST array

    Code:
    <?php
    print_r($_POST);
    ?>
    every field value is sent and recieved you can see it here
    That is awesome, but how do I get those values back into the "HTML" variable so that when I convert to PDF, the values are saved? Remember that I have to 'write' the html code to a file so that it can be converted to pdf.

  12. #12
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    i suspect that the php manual knows the answer much better than me... all i wanted to show was that the values of the text fields filled with javascript are sent and recieved.
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  13. #13
    Join Date
    Jan 2013
    Location
    Schoolcraft Michigan
    Posts
    6

    Red face problem solved

    This problem has been solved! I did not include the javascript library when I "reconstituted" by web page into a file. After I added that line, the boxes filled in by javascript were correct!

    Thanks

Thread Information

Users Browsing this Thread

There are currently 2 users browsing this thread. (0 members and 2 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles