Napisałem na własny użytek ale może komuś się przyda. Prosta funkcja do obsługi ajaxa + funkcja do dodawania parametrów.
Kod
/*
eAjax
Wersja 1.0 Beta
Michał Molenda "Ed"
www.ed.yom.pl
*/
p = new Array (); // Tablica z paramterami
function eAjax( method , file , idName ) {
http_request = false;
var znak = "";
var pStr = "";
if (window.XMLHttpRequest) {
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) {
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) { }
}
}
if (!http_request) {
alert ( 'eAJX : Błąd - Podczas instancji obiektu XMLHTTP' );
return false;
}
for(var i in this.p)
{
if ( i == 0 ) znak = "?";
else znak = "&";
pStr += znak + this.p[i].name + "=" + this.p[i].value ;
}
http_request.onreadystatechange = function() { status( http_request , idName ); };
http_request.open(method, file + pStr , true);
http_request.send(null);
}
function status( http_request , idName ) {
try {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
document.getElementById(idName).innerHTML = http_request.responseText;
} else {
alert('Wystąpił problem z tym żądaniem.');
}
}
}
catch( e ) { }
}
function eAjaxAddParametr ( name , value )
{
var newP = { name : name, value : value }
this.p.push(newP);
}
eAjax
Wersja 1.0 Beta
Michał Molenda "Ed"
www.ed.yom.pl
*/
p = new Array (); // Tablica z paramterami
function eAjax( method , file , idName ) {
http_request = false;
var znak = "";
var pStr = "";
if (window.XMLHttpRequest) {
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) {
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) { }
}
}
if (!http_request) {
alert ( 'eAJX : Błąd - Podczas instancji obiektu XMLHTTP' );
return false;
}
for(var i in this.p)
{
if ( i == 0 ) znak = "?";
else znak = "&";
pStr += znak + this.p[i].name + "=" + this.p[i].value ;
}
http_request.onreadystatechange = function() { status( http_request , idName ); };
http_request.open(method, file + pStr , true);
http_request.send(null);
}
function status( http_request , idName ) {
try {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
document.getElementById(idName).innerHTML = http_request.responseText;
} else {
alert('Wystąpił problem z tym żądaniem.');
}
}
}
catch( e ) { }
}
function eAjaxAddParametr ( name , value )
{
var newP = { name : name, value : value }
this.p.push(newP);
}
Jak wspomniałem jest to dość proste, ale przydaje się w małych projektach.
Teraz przykładowe użycie.
Kod
<html>
<head>
<script type="text/javascript" src="eAjax.js"></script>
<script type="text/javascript">
function show ()
{
eAjaxAddParametr ( 'tekst' , 'Siemanko wam' );
eAjaxAddParametr ( 'id' , 'Jakiś id' );
eAjax ( 'GET' , 'tekst.php' , 't' );
}
</script>
</head>
<body>
<p id="t"></p>
<a href="#" onclick="show()">Pokaz tekst</a>
</body>
</html>
<head>
<script type="text/javascript" src="eAjax.js"></script>
<script type="text/javascript">
function show ()
{
eAjaxAddParametr ( 'tekst' , 'Siemanko wam' );
eAjaxAddParametr ( 'id' , 'Jakiś id' );
eAjax ( 'GET' , 'tekst.php' , 't' );
}
</script>
</head>
<body>
<p id="t"></p>
<a href="#" onclick="show()">Pokaz tekst</a>
</body>
</html>
gdzie plik tekst.php wygląda tak.
A teraz małe objaśnienie.
Kod
eAjaxAddParametr( nazwa , wartość );
Kod
eAjax ( metoda , plik , id elementu w który zostanie wyświetlony wynik);
Inne przykładowe użycie. Można do funkcji W JS przekazać nazwę pola z bazy danych, za pomocą skryptu php pobrać wpisy z tabeli, posortować według przekazanego pola a następnie wyświetlić na stronie bez odświerzania.
Mam nadzieje że komuś się to przyda
Przykład działania można zobaczyć na program.yom.pl Czekam na opnie, komentarze i uwagi.