Load Dinamico con AJAX

Articolo

 Il nostro scopo è quello di caricare dinamicamente, all'interno di un componente HTML come ad es. un DIV, un contenuto diverso (ma che deve sempre appartenere allo stesso dominio).

Tutto ciò lo si può fare con AJAX e con pochi semplici comandi.


La stessa cosa la si può fare utilizzando un IFRAME e mettendo nella parte SRC la URL da richiamare.

 

Leggi il resto del documento per accedere direttamente alla pagina di esempio.


Il codice AJAX è stato preso dal sito dynamicdrive.com qui.

Esempio completo:

<html>
<head>
<title>Test Load Dinamico con AJAX</title>
<head>Test Load Dinamico con AJAX</head>
<script type="text/javascript">
/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var bustcachevar = 0 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects = ""
//var rootdomain = "http://"+window.location.hostname
//alert(rootdomain);
var bustcacheparameter = ""

function ajaxpage(url, containerid){
    var page_request = false
    if (window.XMLHttpRequest) // if Mozilla, Safari etc
        page_request = new XMLHttpRequest()
    else if (window.ActiveXObject){ // if IE
        try {
        page_request = new ActiveXObject("Msxml2.XMLHTTP")
        }
        catch (e){
            try{
                page_request = new ActiveXObject("Microsoft.XMLHTTP")
            }
            catch (e){}
        }
    }
    else
        return false
       
    page_request.onreadystatechange=function(){
        loadpage(page_request, containerid)
    }
   
    if (bustcachevar) //if bust caching of external page
        bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()       
    page_request.open('GET', url+bustcacheparameter, true)
    page_request.send(null)
}

function loadpage(page_request, containerid){
    if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
        document.getElementById(containerid).innerHTML=page_request.responseText
}

function loadobjs(){
    if (!document.getElementById)
        return

    for (i=0; i<arguments.length; i++){
        var file=arguments[i]
        var fileref=""
        if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
            if (file.indexOf(".js")!=-1){ //If object is a js file
                fileref=document.createElement('script')
                fileref.setAttribute("type","text/javascript");
                fileref.setAttribute("src", file);
            }
            else if (file.indexOf(".css")!=-1){ //If object is a css file
                fileref=document.createElement("link")
                fileref.setAttribute("rel", "stylesheet");
                fileref.setAttribute("type", "text/css");
                fileref.setAttribute("href", file);
            }
        }
        if (fileref!=""){
            document.getElementsByTagName("head").item(0).appendChild(fileref)
            loadedobjects+=file+" " //Remember this object as being already added to page
        }
    }
}
</script>
<body>
<a href="javascript:ajaxpage('/index.php', 'contentarea');">www.mauriziogiglio.netsons.org</a>
<div id="contentarea"></div>

</body>
</html>

We use cookies

Utilizziamo i cookie sul nostro sito Web. Alcuni di essi sono essenziali per il funzionamento del sito, mentre altri ci aiutano a migliorare questo sito e l'esperienza dell'utente (cookie di tracciamento). Puoi decidere tu stesso se consentire o meno i cookie. Ti preghiamo di notare che se li rifiuti, potresti non essere in grado di utilizzare tutte le funzionalità del sito.