brad7928
06-01-2009, 05:07 PM
Hi guys, any ideas why this would update in FF but not in IE?
The code i have is:
index.php
<html>
<head>
<title>B-rad's Wall</title>
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="no-cache" />
<link rel="stylesheet" type="text/css" href="css.css" />
<script type="text/javascript" src="jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form#submit_wall").submit(function() {
var message_wall = $('#message_wall').attr('value');
$.ajax({
type: "POST",
url: "insert.php",
data: "message_wall="+ message_wall,
success: function(){
$("ul#wall").prepend("<li style='display:none'>"+message_wall+"</li>");
$("ul#wall li:first").fadeIn();
}
});
return false;
});
});
</script>
</head>
<body>
<h2>B-rad's Wall</h2>
<form action="" id="submit_wall">
<label for="message_wall">Your message: </label>
<input type="text" id="message_wall" class="input" value="Message - First Name" />
<button type="submit">Write!</button>
<button type="reset" onclick="window.location='http://202.45.110.174/social/test'">Refresh</button>
</form>
<table align="center" border="0" height="100%" width="100%">
<tr>
<td width="32%">
</td>
<td width="53%">
<script type="text/javascript">
var xmlhttp;
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("_ticker").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
var init_ticker = function(){
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url="data.php";
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
xmlhttp.timeout = 10000
};
setInterval(init_ticker, 1000);
window.onload = init_ticker;
</script>
<div class="_ticker" id="_ticker">Loading...</div>
</td>
<td width="15%"> </td>
</tr>
</table>
<br />
<br />
<a href="http://www.redhost.com.au"><img src="redhost.jpg" align="center" border="0" /></a>
<h4>Affordable Web Hosting and Design</h4>
<h4>Email: Brad@redhost.com.au .:. <a href="http://www.redhost.com.au">www.Redhost.com.au</a></h4>
</body>
</html>
data.php
<?
$db_host="localhost";
$db_name="messages";
$username="username";
$password="*******";
$db_con=mysql_connect($db_host,$username,$password);
$connection_string=mysql_select_db($db_name);
mysql_connect($db_host,$username,$password);
mysql_select_db($db_name);
$result = mysql_query("select * from messages ORDER BY ID desc");
if(!$result) echo mysql_error();
else {
while($row = mysql_fetch_row($result)) {
?>
<ul id="wall">
<li>
<?
echo "$row[1]<br />\n";
?>
</li>
</ul>
<?
}
}
?>
and the two javascripts up in the index.php page use this to insert the message into the database
insert.php
<?php
if(isset($_POST['message_wall'])){
/* Connection to Database */
include('config.php');
/* Remove HTML tag to prevent query injection */
$message = strip_tags($_POST['message_wall']);
$sql = 'INSERT INTO messages (messages) VALUES( "'.$message.'")';
mysql_query($sql);
echo $message;
} else { echo '0'; }
?>
It all works fine if i take the Ajax out and chuck in some php to grab the messages but i want it to auto update...
This has got me stumped... Site with Ajax is at http://202.45.110.174/social/test
The code i have is:
index.php
<html>
<head>
<title>B-rad's Wall</title>
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="no-cache" />
<link rel="stylesheet" type="text/css" href="css.css" />
<script type="text/javascript" src="jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form#submit_wall").submit(function() {
var message_wall = $('#message_wall').attr('value');
$.ajax({
type: "POST",
url: "insert.php",
data: "message_wall="+ message_wall,
success: function(){
$("ul#wall").prepend("<li style='display:none'>"+message_wall+"</li>");
$("ul#wall li:first").fadeIn();
}
});
return false;
});
});
</script>
</head>
<body>
<h2>B-rad's Wall</h2>
<form action="" id="submit_wall">
<label for="message_wall">Your message: </label>
<input type="text" id="message_wall" class="input" value="Message - First Name" />
<button type="submit">Write!</button>
<button type="reset" onclick="window.location='http://202.45.110.174/social/test'">Refresh</button>
</form>
<table align="center" border="0" height="100%" width="100%">
<tr>
<td width="32%">
</td>
<td width="53%">
<script type="text/javascript">
var xmlhttp;
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("_ticker").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
var init_ticker = function(){
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url="data.php";
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
xmlhttp.timeout = 10000
};
setInterval(init_ticker, 1000);
window.onload = init_ticker;
</script>
<div class="_ticker" id="_ticker">Loading...</div>
</td>
<td width="15%"> </td>
</tr>
</table>
<br />
<br />
<a href="http://www.redhost.com.au"><img src="redhost.jpg" align="center" border="0" /></a>
<h4>Affordable Web Hosting and Design</h4>
<h4>Email: Brad@redhost.com.au .:. <a href="http://www.redhost.com.au">www.Redhost.com.au</a></h4>
</body>
</html>
data.php
<?
$db_host="localhost";
$db_name="messages";
$username="username";
$password="*******";
$db_con=mysql_connect($db_host,$username,$password);
$connection_string=mysql_select_db($db_name);
mysql_connect($db_host,$username,$password);
mysql_select_db($db_name);
$result = mysql_query("select * from messages ORDER BY ID desc");
if(!$result) echo mysql_error();
else {
while($row = mysql_fetch_row($result)) {
?>
<ul id="wall">
<li>
<?
echo "$row[1]<br />\n";
?>
</li>
</ul>
<?
}
}
?>
and the two javascripts up in the index.php page use this to insert the message into the database
insert.php
<?php
if(isset($_POST['message_wall'])){
/* Connection to Database */
include('config.php');
/* Remove HTML tag to prevent query injection */
$message = strip_tags($_POST['message_wall']);
$sql = 'INSERT INTO messages (messages) VALUES( "'.$message.'")';
mysql_query($sql);
echo $message;
} else { echo '0'; }
?>
It all works fine if i take the Ajax out and chuck in some php to grab the messages but i want it to auto update...
This has got me stumped... Site with Ajax is at http://202.45.110.174/social/test