HTML - posting from a form to a text file

  • Context: HTML/CSS 
  • Thread starter Thread starter jjiimmyy101
  • Start date Start date
  • Tags Tags
    File Form Html Text
Click For Summary

Discussion Overview

The discussion revolves around how to post comments from a form on an Angelfire website to a text file, specifically addressing the challenge of displaying the most recent comments at the top of the text file rather than the bottom. Participants explore potential solutions using JavaScript and AJAX, considering the limitations of the platform.

Discussion Character

  • Exploratory
  • Technical explanation
  • Debate/contested

Main Points Raised

  • One participant describes the current setup where comments are added to a text file but appear in reverse order, seeking a method to display them with the newest on top.
  • Another participant suggests that the order of messages is likely determined by server-side or database settings, which may not be accessible.
  • Some participants propose using JavaScript to manipulate the display of comments on a separate HTML page, allowing for customization of how comments are presented.
  • A participant shares a sample HTML/JavaScript code that uses AJAX to load comments from the text file, reverse their order, and display them on the page.
  • Further questions arise regarding how to format the displayed comments, such as bolding the author's name and adjusting line breaks for better readability.
  • There is a query about how the solution would change if the comments page contained HTML, with an implication that modifications could be made to accommodate that scenario.

Areas of Agreement / Disagreement

Participants generally agree on the use of JavaScript and AJAX as a viable solution for displaying comments, but there is no consensus on how the presence of HTML in the comments page would affect the implementation.

Contextual Notes

Limitations include the inability to modify server-side scripts or database settings on the Angelfire platform, which may restrict certain functionalities.

jjiimmyy101
Messages
74
Reaction score
0
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
 
Technology news on Phys.org
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.
 
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
 
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.
 
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?
 

Attachments

Last edited:
I need to look at the HTML in the comments page.
 
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.
 
Ok, so the comments "page" does not contain any html? It's just plain text?
 
Yes, just plain text
 
  • #10
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.
 
  • #11
That's super news :smile:
 
  • #12
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: 
<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>
 
Last edited by a moderator:
  • #13
Thank you so much for all your help and time. It works great.

Jimmy
 
  • #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?
 
  • #15
That's easily accomplished. You only need to look at the following function:
Code: 
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: 
        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 />';
            }
        }
 
  • #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?
 
  • #17
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.
 
  • #18
thanks for all the help!
 

Similar threads

Python Does anyone know about python flask and wtf forms?....
  • · Replies 2 ·
Replies
2
Views
2K
HTML/CSS [CSS] Why do my containers shrink at screen widths <347px?
  • · Replies 5 ·
Replies
5
Views
3K
HTML/CSS HTML - counting the number of responses from a text file
  • · Replies 1 ·
Replies
1
Views
2K
HTML/CSS Are HTML and CSS files necessary in the HTDOCS folder for PHP to work in XAMPP?
  • · Replies 3 ·
Replies
3
Views
3K
HTML/CSS HTML and PHP issue: display HTML form variables using PHP echo
  • · Replies 6 ·
Replies
6
Views
7K
HTML/CSS Html5 <canvas> element related apps not working
  • · Replies 3 ·
Replies
3
Views
2K
Should users confirm their account deletion before it is processed?
  • · Replies 24 ·
Replies
24
Views
2K
Why do emails from my contact form bounce?
  • · Replies 10 ·
Replies
10
Views
4K
HTML/CSS Can a Fortran 95 Program Run Online Using a HTML Form?
  • · Replies 1 ·
Replies
1
Views
2K
Storing program source as relations in a database instead of text file
  • · Replies 65 ·
3
Replies
65
Views
5K