Mam problem z integracją mysql'a z ajaxem, własnie robie czat i w sieci natknołem się na taką instrukcje jednak nic się się nie dodaje do bazy mimo prawidłowego wypełnienia danych dostępowych

na stronie index.html pojawia się tylko przycisk z napisem "add to post" nie ma nawet miejsca gdzie wpisywało by się tekst, po kliknieciu pokazuje ponizej na ułamek sekundy "loading" i tyle i do bazy nic się nie dodaje bo co miało by się dodać skoro się nie da wpisać tekstu :|
Utworzyłem baze według instrukcji
CREATE TABLE ´informit_ajax´ ( ´id´ int(11) NOT NULL AUTO_INCREMENT, ´date´ datetime NOT NULL DEFAULT ’0000-00-00 00:00:00’, ´description´ longtext NOT NULL, ´title´ varchar(100) NOT NULL DEFAULT ’’, PRIMARY KEY (´id´) ) TYPE=MyISAM;
Plik index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link href="css/layout.css" rel="stylesheet" type="text/css" /> </head> <body onload="javascript:makeRequest('services/post.php?method=get');"> <div id="layout" align="center"> </div> </body> </html>
mysql_connect.php
<? $dbc = @mysql_connect (DB_HOST, DB_USER, DB_PASSWORD) OR die (’Could not connect to MySQL: ’ . mysql_error() ); ?>
Post.class.php
<? class Post { var $table; function Post() { require_once('mysql_connect.php'); $this->table = "informit_ajax"; } function dbConnect() { } function get() { $this->dbConnect(); $query = "SELECT * FROM $this->table ORDER BY id"; $xml = "<?xml version=\"1.0\" encoding=\"ISO-8859-1\" ?>\n"; $xml .= "<posts>\n"; { $xml .= "<post>\n"; $xml .= "<id>" . $row['id'] . "</id>\n"; $xml .= "<date>" . $row['date'] . "</date>\n"; $xml .= "<title><![CDATA[" . $row['title'] . "]]></title>\n"; $xml .= "<description><![CDATA[" . $row['description'] . "]]></description>\n"; $xml .= "</post>\n"; } $xml .= "</posts>"; } function save($id, $title, $description) { $this->dbConnect(); $query = "SELECT * FROM $this->table WHERE id='$id'"; { $query = "UPDATE $this->table SET title='$title', description='$description', date=NOW() WHERE id='$id'"; } else { $query = "INSERT INTO $this->table (title, description, date) VALUES ('$title', '$description', NOW())"; } $this->get(); } function delete($id) { $this->dbConnect(); $query = "DELETE FROM $this->table WHERE id='$id'"; $this->get(); } } ?>
layout.css
Kod
/* CSS Document */
body
{
margin: 25px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
#posts
{
width: 500px;
}
.post
{
text-align: left;
border-bottom-style: dashed;
border-bottom-color: #cccccc;
border-bottom-width: 1px;
}
.title
{
font-size: 18px;
font-weight: bold;
color: #003366;
padding-bottom: 10px;
}
.description
{
color: #333333;
}
.date
{
font-size: 9px;
color: #cccccc;
text-align: right;
}
body
{
margin: 25px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
#posts
{
width: 500px;
}
.post
{
text-align: left;
border-bottom-style: dashed;
border-bottom-color: #cccccc;
border-bottom-width: 1px;
}
.title
{
font-size: 18px;
font-weight: bold;
color: #003366;
padding-bottom: 10px;
}
.description
{
color: #333333;
}
.date
{
font-size: 9px;
color: #cccccc;
text-align: right;
}
post.js
Kod
var index;
function onResponse()
{
if(checkReadyState(request))
{
document.getElementById('posts').innerHTML = "";
var response = request.responseXML.documentElement;
var _post = response.getElementsByTagName('post');
if(_post.length == 0)
{
document.getElementById('posts').innerHTML = "There are currently no available posts.<br/>Click the \"add a post\" button above to add a new post";
}
var postDisplay = "";
var formPostDisplay = "";
for(var i=0; i<_post.length; i++)
{
var _title = response.getElementsByTagName('title')[i].firstChild.data;
var _description = response.getElementsByTagName('description')[i].firstChild.data
var _date = response.getElementsByTagName('date')[i].firstChild.data;
var _id = response.getElementsByTagName('id')[i].firstChild.data;
if(_title == "" && _description == "")
{
postDisplay = "style='display:none'";
formPostDisplay = "style=''";
}
else
{
postDisplay = "style=''";
formPostDisplay = "style='display:none'";
}
var html = "<div class='post' id='post_"+ i +"' "+ postDisplay +">"
+ "<div class='title' id='title_"+ i +"'>"+ _title +"</div>"
+ "<div class='description' id='description_"+ i +"'>"+ _description +"</div>"
+ "<div class='date' id='date_"+ i +"'>"+ _date +"</div>"
+ "<a href=\"javascript:toggle('"+ i +"');\">edit this post</a><br/>"
+ "</div>"
+ "<div class='post' id='formPost_"+ i +"' "+ formPostDisplay +">"
+ "<div class='title'><input type='text' name='title' id='formTitle_"+ i +"' size='60' value='"+ _title +"'></div>"
+ "<div class='description'><textarea type='text' id='formDescription_"+ i +"' wrap='virtual' cols='60' rows='15'>"+ _description +"</textarea></div>"
+ "<div class='date'>"+ _date +"</div>"
+ "<input type='button' name='cancel' value='cancel' onclick=\"javascript:toggle('"+ i +"');\">"
+ "<input type='button' name='delete' value='delete this post' onclick=\"javascript:deletePost("+ _id +");\">"
+ "<input type='button' name='submit' value='save this post' onclick=\"javascript:saveNewPost("+ _id +","+ i +");\">"
+ "</div>"
+ "<p> </p>";
document.getElementById('posts').innerHTML += html;
}
}
}
function saveNewPost(_id, _index)
{
var newDescription = document.getElementById("formDescription_"+ _index).value;
var newTitle = document.getElementById("formTitle_"+ _index).value;
setIndex(_index);
sendRequest("services/post.php?method=save&id="+ _id +"&title="+ newTitle +"&description="+ newDescription, getPost);
}
function deletePost(_id)
{
sendRequest("services/post.php?method=delete&id="+ _id, onResponse);
}
function getPost()
{
if(checkReadyState(request))
{
var response = request.responseXML.documentElement;
var _title = response.getElementsByTagName('title')[getIndex()].firstChild.data;
var _description = response.getElementsByTagName('description')[getIndex()].firstChild.data;
var _date = response.getElementsByTagName('date')[getIndex()].firstChild.data;
document.getElementById("title_"+ getIndex()).innerHTML = _title;
document.getElementById("description_"+ getIndex()).innerHTML = _description;
document.getElementById("date_"+ getIndex()).innerHTML = _date;
toggle(getIndex());
}
}
function toggle(id)
{
if(document.getElementById("formPost_"+id).style.display == 'none')
{
document.getElementById("formPost_"+id).style.display = '';
document.getElementById("post_"+id).style.display = 'none';
}
else if(document.getElementById("post_"+id).style.display == 'none')
{
document.getElementById("post_"+id).style.display = '';
document.getElementById("formPost_"+id).style.display = 'none';
}
}
function setIndex(_index) { index = _index; }
function getIndex() { return index; }
function onResponse()
{
if(checkReadyState(request))
{
document.getElementById('posts').innerHTML = "";
var response = request.responseXML.documentElement;
var _post = response.getElementsByTagName('post');
if(_post.length == 0)
{
document.getElementById('posts').innerHTML = "There are currently no available posts.<br/>Click the \"add a post\" button above to add a new post";
}
var postDisplay = "";
var formPostDisplay = "";
for(var i=0; i<_post.length; i++)
{
var _title = response.getElementsByTagName('title')[i].firstChild.data;
var _description = response.getElementsByTagName('description')[i].firstChild.data
var _date = response.getElementsByTagName('date')[i].firstChild.data;
var _id = response.getElementsByTagName('id')[i].firstChild.data;
if(_title == "" && _description == "")
{
postDisplay = "style='display:none'";
formPostDisplay = "style=''";
}
else
{
postDisplay = "style=''";
formPostDisplay = "style='display:none'";
}
var html = "<div class='post' id='post_"+ i +"' "+ postDisplay +">"
+ "<div class='title' id='title_"+ i +"'>"+ _title +"</div>"
+ "<div class='description' id='description_"+ i +"'>"+ _description +"</div>"
+ "<div class='date' id='date_"+ i +"'>"+ _date +"</div>"
+ "<a href=\"javascript:toggle('"+ i +"');\">edit this post</a><br/>"
+ "</div>"
+ "<div class='post' id='formPost_"+ i +"' "+ formPostDisplay +">"
+ "<div class='title'><input type='text' name='title' id='formTitle_"+ i +"' size='60' value='"+ _title +"'></div>"
+ "<div class='description'><textarea type='text' id='formDescription_"+ i +"' wrap='virtual' cols='60' rows='15'>"+ _description +"</textarea></div>"
+ "<div class='date'>"+ _date +"</div>"
+ "<input type='button' name='cancel' value='cancel' onclick=\"javascript:toggle('"+ i +"');\">"
+ "<input type='button' name='delete' value='delete this post' onclick=\"javascript:deletePost("+ _id +");\">"
+ "<input type='button' name='submit' value='save this post' onclick=\"javascript:saveNewPost("+ _id +","+ i +");\">"
+ "</div>"
+ "<p> </p>";
document.getElementById('posts').innerHTML += html;
}
}
}
function saveNewPost(_id, _index)
{
var newDescription = document.getElementById("formDescription_"+ _index).value;
var newTitle = document.getElementById("formTitle_"+ _index).value;
setIndex(_index);
sendRequest("services/post.php?method=save&id="+ _id +"&title="+ newTitle +"&description="+ newDescription, getPost);
}
function deletePost(_id)
{
sendRequest("services/post.php?method=delete&id="+ _id, onResponse);
}
function getPost()
{
if(checkReadyState(request))
{
var response = request.responseXML.documentElement;
var _title = response.getElementsByTagName('title')[getIndex()].firstChild.data;
var _description = response.getElementsByTagName('description')[getIndex()].firstChild.data;
var _date = response.getElementsByTagName('date')[getIndex()].firstChild.data;
document.getElementById("title_"+ getIndex()).innerHTML = _title;
document.getElementById("description_"+ getIndex()).innerHTML = _description;
document.getElementById("date_"+ getIndex()).innerHTML = _date;
toggle(getIndex());
}
}
function toggle(id)
{
if(document.getElementById("formPost_"+id).style.display == 'none')
{
document.getElementById("formPost_"+id).style.display = '';
document.getElementById("post_"+id).style.display = 'none';
}
else if(document.getElementById("post_"+id).style.display == 'none')
{
document.getElementById("post_"+id).style.display = '';
document.getElementById("formPost_"+id).style.display = 'none';
}
}
function setIndex(_index) { index = _index; }
function getIndex() { return index; }
request.js
Kod
function makeRequest(url)
{
sendRequest(url, onResponse);
}
function sendRequest(url, callbackMethod)
{
request = createRequestObject();
request.onreadystatechange = callbackMethod;
request.open("POST", url, true);
request.send(url);
}
function createRequestObject()
{
if(window.XMLHttpRequest)
{
obj = new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
obj = new ActiveXObject("MSXML2.XMLHTTP");
}
return obj;
}
function checkReadyState(obj)
{
if(obj.readyState == 0) { document.getElementById('loading').innerHTML = "Sending Request..."; }
if(obj.readyState == 1) { document.getElementById('loading').innerHTML = "Loading..."; }
if(obj.readyState == 2) { document.getElementById('loading').innerHTML = "Loading..."; }
if(obj.readyState == 3) { document.getElementById('loading').innerHTML = "Loading..."; }
if(obj.readyState == 4)
{
if(obj.status == 200)
{
document.getElementById('loading').innerHTML = "";
return true;
}
else
{
document.getElementById('loading').innerHTML = "HTTP " + obj.status;
}
}
}
{
sendRequest(url, onResponse);
}
function sendRequest(url, callbackMethod)
{
request = createRequestObject();
request.onreadystatechange = callbackMethod;
request.open("POST", url, true);
request.send(url);
}
function createRequestObject()
{
if(window.XMLHttpRequest)
{
obj = new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
obj = new ActiveXObject("MSXML2.XMLHTTP");
}
return obj;
}
function checkReadyState(obj)
{
if(obj.readyState == 0) { document.getElementById('loading').innerHTML = "Sending Request..."; }
if(obj.readyState == 1) { document.getElementById('loading').innerHTML = "Loading..."; }
if(obj.readyState == 2) { document.getElementById('loading').innerHTML = "Loading..."; }
if(obj.readyState == 3) { document.getElementById('loading').innerHTML = "Loading..."; }
if(obj.readyState == 4)
{
if(obj.status == 200)
{
document.getElementById('loading').innerHTML = "";
return true;
}
else
{
document.getElementById('loading').innerHTML = "HTTP " + obj.status;
}
}
}
post.php
<? require_once("../classes/Post.class.php"); $post = new Post(); $post->$method($id, $title, $description); ?>