Jump to content

HTML / Javascript chat


TehBlizzy

Recommended Posts

For fun, I've been making a random chat room out of Javascript and HTML. The only thing is, I don't know how to make it so the user input saves to the frame file so it doesn't dissapear when refreshed and others could see what was typed in. Below is my whole page and what its made of so far:

<html>	<head>		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">		<title>Random HTML/Javascript Chat</title>	</head>	<body>		<div id="content">			<script style="javascript">thename=document.Name.Username.value=name;function sendMsg() {	message=document.Msg.UserMsg.value;	thename=document.Name.Username.value;	document.the_text.document.write(''+thename,' says:',' '+message,'<br></font>');}</script>		</div>		<script style="javascript">function changeName() {	thename=document.Name.Username.value;}function rload() {	window.the_text.location.reload(true);}</script>		<center>			<br>			<br>			<br>			<table width="800" border="1" height="500">				<tr height="50">					<td colspan="2">						<center>							<h1>HTML/Javascript Chat Room</h1>						</center>					</td>				</tr>				<tr height="400">					<td width="150">						<center>							<font face="Comic Sans MS"></font></center>					</td>					<td width="650">						<center>							<iframe id="the_text" name="the_text" src="text.htm" height="350" width="650" border="0"></iframe>							 <button onclick="rload()">Refresh</button></center>					</td>				</tr>				<tr>					<td width="150">						<form name="Name">							<center>								<input id="Username" type="text" name="Username" value="Username"></center>						</form>					</td>					<td>						<center>							<form name="Msg">								<input id="UserMsg" type="text" name="UserMsg" size="90"> <button onclick="sendMsg()" name="sendmsg">Send!</button>							</form>						</center>					</td>				</tr>				<tr height="25">					<td colspan="2" width="800">To change font colors, type in <font color="color">. Some colors are Red, Blue, Aqua, Purple, Pink, Green, and Teal.</td>				</tr>			</table>		</center>	</body></html>

Everything works right how I want except for the input not being saved. Is it even possible to save with Javascript? :)

Link to comment
Share on other sites

  • Replies 53
  • Created
  • Last Reply

Javascript cannot access the filesystem, so it cannot save to files. Even if it could, because javascript executes locally on a person's browser (i.e. the "Client"), only that client would be able to access the file.If you want others to share the data, you'll have to use a server-side solution (i.e. the "Server") to write the chat data to something (e.g. database, file, session, application cache, etc.) and have the clients read the data from that data source.While you could use javascript for most of this, you'd need a server-side solution (e.g. PHP, ASP.NET, Cold Fusion, etc) to store and serve the chat data.

Link to comment
Share on other sites

Jesh said it perfectly. I looked at the original post and I thought: "You can't save Javascript information on a server." Personally if you want to share the data I would recommend PHP. ASP.NET and CF tend to get more complicated while as PHP you only need a basic understanding to do what you want to do. If you want to add some features to this chat box with PHP then I would suggest learning more of this.

Link to comment
Share on other sites

Adn don't forget to look up AJAX if you don't want your chat client to be very slow!

Link to comment
Share on other sites

I'm doing this all at school because I don't have a computer at home :)I've never tried anything other than HTML and Javascript so I'm clueless when it comes to PHP and stuff. If I saw examples I could easily learn though.

Link to comment
Share on other sites

What are you trying to do? Have a form processing script append the form data onto the end of a file? Your data comes from $_POST, so however you want to format that is up to you. Something like this maybe:$text = $_POST['name'] . ": " . $_POST['message'];To write data to a file you use fopen to open the file and then fwrite. Check the reference for fwrite for examples:http://www.php.net/manual/en/function.fwrite.php

Link to comment
Share on other sites

Go for AJAX.It will save you the money required to have a domain that allows SQL.

Link to comment
Share on other sites

Huh? A database doesn't really cost anything, the vast majority of hosts offer databases, most of them for no extra charge. Also, using AJAX is not a replacement for a database. The PHP script that AJAX is using would still need to get the information from somewhere, be it a file or a database. It would be easiest to store it in a database.

Link to comment
Share on other sites

I can't find out how to save the inputs into the html frame file
Um... you could use PHP's XML or file functions to write the chat conversations to a HTML file, however it would be far easier, more maintainable and offer infinitely greater flexibility if you used the PHP MySQL interface to store the conversations to a database, then call them and echo() them to a PHP page, may it be an iframe or a AJAX-generated division.
Link to comment
Share on other sites

Kinda both. It doesn't have to constantly refresh the frame but it refreshes when the user sends a message and every few seconds, like a 5 second interval.I only have 1 hr and 30 minutes of computer time at school so I can't do alot every day, but I'll keep looking into the PHP tutorials and stuff :)

Link to comment
Share on other sites

Hmmm... after following alot of tutorials and examples my way isn't working. Does PHP work on the computer or does it have to be on a server? Now that I think of it, I'm sure it has to be on a server... not sure though e_eThis is basically all I'm using for the PHP script:

<?php 	$msg = $_POST["UserMsg"];	$file = fopen("text.htm","a+");	fwrite($file,"Test");	fclose($file);	exit; ?>

I'm pretty sure its wrong though :)

Link to comment
Share on other sites

You must download PHP, It's an open source project so its free to download. Just save your files (When you have inserted PHP) as (whatever.PHP) and make sure you have PHP installed correctly and it should work. For the server you must make sure the server supports PHP

Link to comment
Share on other sites

It doesn't matter if you install PHP on your computer or not. The server is what is important. If you are using your local computer as the server then you need to install a web server and the PHP software in order for that server to run PHP. You don't need anything on the client though, it won't even get used.The code you have up there will write some text to the file that you opened. Make sure the path to the file is correct.

Link to comment
Share on other sites

Nope. Nevermind. Found a bug. How do I make it so it will only post the message when the Send! button is clicked instead of when the page is refreshed and make it go to the next line?Oh, ok. I'll just find the Javascript refresh command and make the button onClick it :)

Link to comment
Share on other sites

You'll need to use AJAX... You click the Send button, and it runs some PHP in another file which will update the database or text file where the conversation is stored.It's a little complicated.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.


×
×
  • Create New...