Dismiss Notice
Join Physics Forums Today!
The friendliest, high quality science and math community on the planet! Everyone who loves science is here!

HTML - posting from a form to a text file

  1. Apr 28, 2007 #1
    HTML -- posting from a form to a text file

    Hey all!

    I have an angelfire website and on one of my pages I have a "comments page". It simply asks for a user's name and any comments he/she may have. These two pieces of information are then submitted to a text file.

    My problem is that a new message (i.e. most recent message) is always added to the bottom of the text file, but I would like new messages to be posted to the top of the text file. (the messages are separated by three asterisks above and below the message)

    Is there anyway to accomplish this, keeping in mind that angelfire will not allow me to add any of my own cgi, php, asp, etc.

    Is there a way to read the file from the bottom to the top and post it to another text file?

    Any suggestions would be appreciated.

    Jimmy
     
  2. jcsd
  3. Apr 29, 2007 #2

    -Job-

    User Avatar
    Science Advisor

    When a message is submited it's probably POSTed to a server-side script and added to a database. For viewing the messages another script pulls the saved content from the database and writes it out to the page.

    So the order that the messages appear in is defined in either the server-side or database layer both of which you probably don't have access to.

    You should make sure there aren't some configuration settings (i.e. an AngelFire control panel, etc) that will allow you to set the ordering.

    If you can write Javascript onto any of your AngelFire pages then you have some further options.
     
  4. May 1, 2007 #3
    Thanks for the input.

    I cannot set the ordering of the messages, but I can use Javascript. I have some knowledge of programming, but by no means is it extensive. I would appreciate any pointers you could give me that would get me going in the right direction.

    Jimmy
     
  5. May 1, 2007 #4

    -Job-

    User Avatar
    Science Advisor

    Do you have a link you can post? You can use Javascript to modify the HTML document, but the specifics are dependent on the html structure of the page.
     
  6. May 1, 2007 #5
    I've attached what the comments page looks like and what the actual comments text file looks like. Is this what you need to see?
     

    Attached Files:

    Last edited: May 1, 2007
  7. May 2, 2007 #6

    -Job-

    User Avatar
    Science Advisor

    I need to look at the HTML in the comments page.
     
  8. May 3, 2007 #7
    I don't quite understand.

    The form.txt file is all the coding that appears on the comments page (it's a very simple and basic web page. I just didn't copy the <HTML> and </HTML> tags). When the person clicks on submit, the message is then added to the comments.txt file. That's it.

    I don't have access to the cgi script called "form_handler_file" though.
     
  9. May 3, 2007 #8

    -Job-

    User Avatar
    Science Advisor

    Ok, so the comments "page" does not contain any html? It's just plain text?
     
  10. May 4, 2007 #9
    Yes, just plain text
     
  11. May 4, 2007 #10

    -Job-

    User Avatar
    Science Advisor

    Ok, then you can create a separate HTML page, for viewing comments that loads the comments from comments.txt using Ajax and displays them. This way you'll have full control over how and where the comments are displayed.

    I'll try to post some sample javascript.
     
  12. May 4, 2007 #11
    That's super news :rofl:
     
  13. May 5, 2007 #12

    -Job-

    User Avatar
    Science Advisor

    The following HTML/Javascript uses Ajax to load the data from the comments.txt that you posted parses the comments (to extract date, ip, author, text), reverses the order of the comments (so that latest show on top) and then prints them onto the page. You can customize the look for example, or place this in another html page.

    I have a link to a sample page here if you want to see this in action:
    http://pi.bloo.us:800/temp/help/

    Code (Text):

    <html>
    <head>
        <title>Untitled Page</title>
        <style type="text/css">
            .comTitle{
                font-family: Arial;
                background-color: #CCCCCC;
            }
            .comText{
                font-family: Arial;
            }
        </style>
    </head>
    <body>
        <h1>Comments:</h1>
        <div id="CommPanel"></div>
        <script type="text/javascript">
            cp = document.getElementById('CommPanel');
            cf = window.frames['CommFrame'];
            function LoadCommentData(file){
                var xmlhttp=false;
                /*@cc_on @*/
                /*@if (@_jscript_version >= 5)
                try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {
                try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");} catch (E) {xmlhttp = false;}}
                @end @*/
                if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
                try {xmlhttp = new XMLHttpRequest();} catch (e) {xmlhttp=false;}}
                if (!xmlhttp && window.createRequest) {try {xmlhttp = window.createRequest();} catch (e) {xmlhttp=false;}}
                if(xmlhttp){
                    xmlhttp.open("GET", file,true);
                    xmlhttp.onreadystatechange = function() {if (xmlhttp.readyState==4)PutComments(ParseComments(xmlhttp.responseText));}
                    xmlhttp.send(null);
                }
            }
            function ParseComments(str){
                temp = str.split('\n***');
                comArray = [];
                for(t in temp){
                    ts = temp[t];
                    date = '';
                    ip = '';
                    author = '';
                    text = '';
                    try{
                        date = ts.substring(t!=0, ts.indexOf('Submitting Host: ')-1);
                        ip = ts.substring(ts.indexOf('Submitting Host: ') + 17, ts.indexOf('\nCOMMENTS:\t'));
                        author = ts.substring(ts.indexOf('WRITTEN_BY:\t') + 12);
                        text = ts.substring(ts.indexOf('COMMENTS:\t') + 9, ts.indexOf('WRITTEN_BY:\t'));
                    }catch(x){}
                    if(text)comArray.push({Date:date, IP:ip, Author:author, Text: text});
                }
                return comArray
            }
            function PutComments(comArray){
                comArray.reverse();
                for(c in comArray){
                    cmt = comArray[c];
                    cp.innerHTML += '<span class="comTitle">' + cmt.Author + ' (' + cmt.IP + ') on ' + cmt.Date + ' said:</span><br />';
                    cp.innerHTML += '<span class="comText">' + cmt.Text + '</span><br /><br />';
                }
            }
            LoadCommentData("comments.txt");
        </script>
    </body>
    </html>
     
     
  14. May 6, 2007 #13
    Thank you so much for all your help and time. It works great.

    Jimmy
     
  15. May 7, 2007 #14
    Two more quick questions...how would I...

    (1) only bold the user's name, while leaving the date and ip address as is?

    (2) put line breaks after the name, ip address and date so that they appear on top of each other instead of next to each other in a row?
     
  16. May 7, 2007 #15

    -Job-

    User Avatar
    Science Advisor

    That's easily accomplished. You only need to look at the following function:
    Code (Text):

    function PutComments(comArray){
                comArray.reverse();
                for(c in comArray){
                    cmt = comArray[c];
                    cp.innerHTML += '<span class="comTitle">' + cmt.Author + ' (' + cmt.IP + ') on ' + cmt.Date + ' said:</span><br />';
                    cp.innerHTML += '<span class="comText">' + cmt.Text + '</span><br /><br />';
                }
            }
     
    Here cmt is a comment object with four properties:
    cmt.Author
    cmt.IP
    cmt.Date
    cmt.Text

    The PutComments function generates the html for the comments section by looping through each comment object. So you can add <b> </b> for bold and <br /> for a line break:

    Code (Text):

            function PutComments(comArray){
                comArray.reverse();
                for(c in comArray){
                    cmt = comArray[c];
                    cp.innerHTML += '<span class="comTitle"><b>' + cmt.Author + '</b></span>';
                    cp.innerHTML += '<span class="comText"><br />' + cmt.IP + '<br />on ' + cmt.Date + '<br /><br />' + cmt.Text + '</span><br /><br />';
                }
            }
     
     
  17. May 9, 2007 #16
    Thanks again. That works great.

    Just out of curiosity though, in post #8 you asked if the comments page had any html on it and because it doesn't, this method you showed me would work. What would happen if there was html in the comments page? Would this code still work? I'm assuming the code could be modified to make it work or am I wrong?
     
  18. May 9, 2007 #17

    -Job-

    User Avatar
    Science Advisor

    If the comments were HTML then you could add javascript that would modify the way the comments are displayed, and you wouldn't need to use Ajax to load them separately.

    If you can add javascript to an html page then you have 100% control over what the page looks like.
     
  19. May 14, 2007 #18
    thanks for all the help!
     
Know someone interested in this topic? Share this thread via Reddit, Google+, Twitter, or Facebook

Have something to add?