Scripts

Memo AJAX

Door Zero XT -04-05-2008 00:00 -7.923 views

Zie hier mijn aller eerste script hier op PHPhulp: Met behulp van Ajax een memo zonder opslaan button. Type tekst in de memo en d.m.v. Ajax worden de gegevens verstuurd naar PHP die vervolgens de gegevens doorstuurd naar jouw database. Database gegevens: CREATE TABLE `memo` ( `ID` int(11) NOT NULL auto_increment, `bericht` text NOT NULL, PRIMARY KEY (`ID`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ; Ik ben helemaal weg van kritiek, zolang dit maar opbouwend is. Veel plezier ermee.

Download alle bestanden als ZIP

memo-ajax

index.html:

[code]
<!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">

<style type="text/css">
body{
font-family: Verdana;
font-size: 10pt;
}
</style>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Memo</title>

<script language="JavaScript" type="text/javascript">
    var verzendAanvraag = haalXmlHttpRequestObject();
    var ontvangAanvraag = haalXmlHttpRequestObject();
    var memo;
    var verzend;
    
    function haalXmlHttpRequestObject()
    {
        if (window.XMLHttpRequest)
        {
            return new XMLHttpRequest();
        }
        else if(window.ActiveXObject)
        {
            return new ActiveXObject("Microsoft.XMLHTTP");
        }
    }
    
    function haalMemoOp()
    {
        if(ontvangAanvraag.readyState == 4 || ontvangAanvraag.readyState == 0)
        {
            ontvangAanvraag.open("GET", "memo.php", true);
            ontvangAanvraag.onreadystatechange = afhandelOntvang;
            ontvangAanvraag.send(null);
        }
    }
    
    function afhandelOntvang()
    {
        if(ontvangAanvraag.readyState == 4)
        {
            document.getElementById('memo').innerHTML = ontvangAanvraag.responseText;
        }
    }

    function verstuur()
    {
        if(verzendAanvraag.readyState == 4 || verzendAanvraag.readyState == 0)
        {
            verzendAanvraag.open("POST", "memo.php", true);
            verzendAanvraag.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            var bericht = 'b=' + document.getElementById("memo").value;
            verzendAanvraag.send(bericht);
        }
    }
</script>

</head>

<body onload="haalMemoOp();">

<noscript><br /><br /><b>Voor deze pagina moet je JavaScript ingeschakeld hebben.</b><br /><br /><br /><br /></noscript>

Je gegevens worden automatisch opgeslagen.

<br />
<br />
<br />

<textarea id="memo" onblur="verstuur();" onunload="verstuur();" onmouseout="verstuur();" cols="" rows="4" style="width:450px;"></textarea>

</body>
</html>
[/code]




memo.php:
[code]
<?php
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT" ); 
header("Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" ); 
header("Cache-Control: no-cache, must-revalidate" ); 
header("Pragma: no-cache" );
header("Content-Type: text; charset=utf-8");

$DBserver = 'localhost';
$DBgebruiker = '';
$DBwachtwoord = '';
$DB = '';


mysql_connect($DBserver,$DBgebruiker,$DBwachtwoord)
or die('Could not connect: ' . mysql_error());

mysql_select_db($DB) or die('Could not select database');

if(isset($_POST['b']) AND strlen($_POST['b']) < 450)
{
	mysql_query("UPDATE memo SET bericht = '".mysql_real_escape_string($_POST['b'])."' WHERE ID = 1");
}

$query = "SELECT bericht FROM memo";
$result = mysql_query($query) or die(mysql_error());

while($line = mysql_fetch_assoc($result))
{
	echo $line['bericht'];
}
?>
[/code]