Navigation ajax d'une div ?

Ben à voir le script, c'est pour appeler une page HTML, donc c'est un peu mort pour avoir qu'une div...

Mais bon, l'AJAX c'est une bibliothéque, donc c'est du c/c, faut juste trouver le bon code !

Bon courage

Salut,

C'est la ligne 41 ( $("#ajax" ).append(data); ) que tu vas devoir modifier.
Il faudrait que tu parses le contenu de la variable data afin de récupérer seulement l'élément que tu veux. Et après seulement, mettre le tout dans la div #ajax en mettant la ligne ci-dessus.

Tu peux regarder ce lien pour parser du XML en javascript:
http://www.hiteshagrawal.com/javascript/javascript-pars...

OK merci pour vos réponses.

Mais la je vais passer pour stupide mais je ne comprends rien a tout ce qu'il est ecrit. Je n'ai pas précisé mais je suis débutant dans ces languages. Le xhtml, css, php ça va mais la je suis perdu.

Je ne sais meme pas ce que veux dire parser... coller ?

J'a bien compris ce qu'il fallait que je fasse. Mais je n'ai pas de fichier xml.

Il faut que je colle le contenu de ma variable data (qui est ma page entiere), que je trouve dessus la div qui m'interesse et que je le mette dans la div#ajax avant de l'afficher ?

Desolé...

Alors, oui, dans ta variable data, tu as ta page entière. Il va falloir que dans cette variable tu ne récupères que ce que tu veux.
Quand tu fais un alert(data); est-ce que tu as juste du contenu HTML de ta page, ou est-ce que tu as un nom d'objet ? Genre HTMLElement ?

Merci pour vos réponses !

Finalement en changeant tout le code pour un plus petit ça fonctionne :

$(document).ready(function(){       

   $("#menu_vert a").click(function(){       

    page=($(this).attr("href"));   

    $("#content").load(page+" #content");  

    return false;   

   });  

});

Par contre maintenant j'ai d'autre problemes.

J'utilise des charts dans ma page. Il s'affiche lorsque je vais sur la page http://www.avoclix.com/index.php?view=account
Mais lorsque j'arrive sur cette page via la navigation, ils ne fonctionnent plus.

Je ne sais pas trop quoi vous montrer comme code alors je vais vous donner le .js des charts et le code qui affiche les charts.

Voici le FusionCharts.js

if(typeof infosoftglobal == "undefined") var infosoftglobal = new Object(); 

if(typeof infosoftglobal.FusionChartsUtil == "undefined") infosoftglobal.FusionChartsUtil = new Object(); 

infosoftglobal.FusionCharts = function(swf, id, w, h, debugMode, registerWithJS, c, scaleMode, lang){ 

    if (!document.getElementById) { return; } 

 
    //Flag to see whether data has been set initially 

    this.initialDataSet = false; 

 
    //Create container objects 

    this.params = new Object(); 

    this.variables = new Object(); 

    this.attributes = new Array(); 

 
    //Set attributes for the SWF 

    if(swf) { this.setAttribute('swf', swf); } 

    if(id) { this.setAttribute('id', id); } 

    if(w) { this.setAttribute('width', w); } 

    if(h) { this.setAttribute('height', h); } 

 
    //Set background color 

    if(c) { this.addParam('bgcolor', c); } 

 
    //Set Quality     

    this.addParam('quality', 'high'); 

 
    //Add scripting access parameter 

    this.addParam('allowScriptAccess', 'always'); 

 
    //Pass width and height to be appended as chartWidth and chartHeight 

    this.addVariable('chartWidth', w); 

    this.addVariable('chartHeight', h); 

 
    //Whether in debug mode 

    debugMode = debugMode ? debugMode : 0; 

    this.addVariable('debugMode', debugMode); 

    //Pass DOM ID to Chart 

    this.addVariable('DOMId', id); 

    //Whether to registed with JavaScript 

    registerWithJS = registerWithJS ? registerWithJS : 0; 

    this.addVariable('registerWithJS', registerWithJS); 

 
    //Scale Mode of chart 

    scaleMode = scaleMode ? scaleMode : 'noScale'; 

    this.addVariable('scaleMode', scaleMode); 

    //Application Message Language 

    lang = lang ? lang : 'EN'; 

    this.addVariable('lang', lang); 

} 

 
infosoftglobal.FusionCharts.prototype = { 

    setAttribute: function(name, value){ 

        this.attributes   = value; 

    }, 

    getAttribute: function(name){ 

        return this.attributes  ; 

    }, 

    addParam: function(name, value){ 

        this.params   = value; 

    }, 

    getParams: function(){ 

        return this.params; 

    }, 

    addVariable: function(name, value){ 

        this.variables   = value; 

    }, 

    getVariable: function(name){ 

        return this.variables  ; 

    }, 

    getVariables: function(){ 

        return this.variables; 

    }, 

    getVariablePairs: function(){ 

        var variablePairs = new Array(); 

        var key; 

        var variables = this.getVariables(); 

        for(key in variables){ 

            variablePairs.push(key +"="+ variables  ); 

        } 

        return variablePairs; 

    }, 

    getSWFHTML: function() { 

        var swfNode = ""; 

        if (navigator.plugins && navigator.mimeTypes && navigator.mimeTypes.length) {  

            // netscape plugin architecture             

            swfNode = '<embed type="application/x-shockwave-flash" src="'+ this.getAttribute('swf') +'" width="'+ this.getAttribute('width') +'" height="'+ this.getAttribute('height') +'"  '; 

            swfNode += ' id="'+ this.getAttribute('id') +'" name="'+ this.getAttribute('id') +'" '; 

            var params = this.getParams(); 

             for(var key in params){ swfNode +=    +'="'+ params   +'" '; } 

            var pairs = this.getVariablePairs().join("&"); 

             if (pairs.length > 0){ swfNode += 'flashvars="'+ pairs +'"'; } 

            swfNode += '/>'; 

        } else { // PC IE             

            swfNode = '<object id="'+ this.getAttribute('id') +'" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="'+ this.getAttribute('width') +'" height="'+ this.getAttribute('height') +'">'; 

            swfNode += '<param name="movie" value="'+ this.getAttribute('swf') +'" />'; 

            var params = this.getParams(); 

            for(var key in params) { 

             swfNode += '<param name="'+ key +'" value="'+ params   +'" />'; 

            } 

            var pairs = this.getVariablePairs().join("&");             

            if(pairs.length > 0) {swfNode += '<param name="flashvars" value="'+ pairs +'" />';} 

            swfNode += "</object>"; 

        } 

        return swfNode; 

    }, 

    setDataURL: function(strDataURL){ 

        //This method sets the data URL for the chart. 

        //If being set initially 

        if (this.initialDataSet==false){ 

            this.addVariable('dataURL',strDataURL); 

            //Update flag 

            this.initialDataSet = true; 

        }else{ 

            //Else, we update the chart data using External Interface 

            //Get reference to chart object 

            var chartObj = infosoftglobal.FusionChartsUtil.getChartObject(this.getAttribute('id')); 

            chartObj.setDataURL(strDataURL); 

        } 

    }, 

    setDataXML: function(strDataXML){ 

        //If being set initially 

        if (this.initialDataSet==false){ 

            //This method sets the data XML for the chart INITIALLY. 

            this.addVariable('dataXML',strDataXML); 

            //Update flag 

            this.initialDataSet = true; 

        }else{ 

            //Else, we update the chart data using External Interface 

            //Get reference to chart object 

            var chartObj = infosoftglobal.FusionChartsUtil.getChartObject(this.getAttribute('id')); 

            chartObj.setDataXML(strDataXML); 

        } 

    }, 

    render: function(elementId){ 

        var n = (typeof elementId == 'string') ? document.getElementById(elementId) : elementId; 

        n.innerHTML = this.getSWFHTML(); 

        return true;         

    } 

} 

 
// ------------ Fix for Out of Memory Bug in IE in FP9 ---------------// 

/* Fix for video streaming bug */ 

infosoftglobal.FusionChartsUtil.cleanupSWFs = function() { 

    if (window.opera || !document.all) return; 

    var objects = document.getElementsByTagName("OBJECT"); 

    for (var i=0; i < objects.length; i++) { 

        objects.style.display = 'none'; 

        for (var x in objects[i]) { 

            if (typeof objects[i][x] == 'function') { 

                objects[i][x] = function(){}; 

            } 

        } 

    } 

} 

// Fixes bug in fp9 

infosoftglobal.FusionChartsUtil.prepUnload = function() { 

    __flash_unloadHandler = function(){}; 

    __flash_savedUnloadHandler = function(){}; 

    if (typeof window.onunload == 'function') { 

        var oldUnload = window.onunload; 

        window.onunload = function() { 

            infosoftglobal.FusionChartsUtil.cleanupSWFs(); 

            oldUnload(); 

        } 

    } else { 

        window.onunload = infosoftglobal.FusionChartsUtil.cleanupSWFs; 

    } 

} 

if (typeof window.onbeforeunload == 'function') { 

    var oldBeforeUnload = window.onbeforeunload; 

    window.onbeforeunload = function() { 

        infosoftglobal.FusionChartsUtil.prepUnload(); 

        oldBeforeUnload(); 

    } 

} else { 

    window.onbeforeunload = infosoftglobal.FusionChartsUtil.prepUnload; 

} 

 
/* Add Array.push if needed (ie5) */ 

if (Array.prototype.push == null) { Array.prototype.push = function(item) { this[this.length] = item; return this.length; }} 

 
/* Function to return Flash Object from ID */ 

infosoftglobal.FusionChartsUtil.getChartObject = function(id) 

{ 

  if (window.document  ) { 

      return window.document  ; 

  } 

  if (navigator.appName.indexOf("Microsoft Internet")==-1) { 

    if (document.embeds && document.embeds  ) 

      return document.embeds  ;  

  } else { 

    return document.getElementById(id); 

  } 

} 

/* Aliases for easy usage */ 

var getChartFromId = infosoftglobal.FusionChartsUtil.getChartObject; 

var FusionCharts = infosoftglobal.FusionCharts;

Et voila l'appelle dans le summary.tpl

<div id="chartdiv" align="center">  

        FusionCharts. </div> 

      <script type="text/javascript"> 

           var chart = new FusionCharts("js/Line.swf?ChartNoDataText=Please select a record above", "ChartId", "310", "144", "0", "0"); 

           chart.setDataXML("<chart bgSWF='charts/chart.png' canvasBorderColor='e0e0e0' lineColor='33373e' showShadow='1' shadowColor='bdbdbd' anchorBgColor='f1cc2b' caption='Your advertisement clicks' showLabels='0' numVDivLines='8' hoverCapBgColor='f7df39' decimalPrecision='2' formatNumberScale='0' showValues='0'  divLineAlpha='20' alternateHGridAlpha='6'>{$myclicks}</chart>");            

           chart.render("chartdiv"); 

        </script> 

 
    </div>

Je suis bien conscient que ça fait beaucoup de code et j'en suis desolé.
Mes Charts sont bien dans ma div ajax.

Je ne comprends pas trop pourquoi.
Quelqu'un a une idée ?
Ca vient peut etre du fait que la navigation ajax ne peut pas charger un .js

Merci d'avance aux courageux en tout cas !

Salut,

Difficile de dire sans avoir de compte de test, tu as un compte de test que je puisse tester cette page ?

alors je viens d'en créer un :
username : test
mdp : azerty

Merci d'avance Omar

edit : Ah tiens j'ai trouvé a cette adresse : http://www.fusioncharts.com/free/demos/ qu'il y a moyen d'utiliser ces charts avec ajax.
Je ne sais pas si ça peut aider...

En fait, il semblerait que le code javascript qui lance le Chart ne soit pas récupéré lorsque tu fais ton chargement en AJAX.
La méthode load() de JQuery que tu utilises n'a pas l'air de récupérer ton appel JavaScript ?!
Vu que tu spécifies que tu ne veux que le contenu de l'élément avec l'ID "ajax", c'est peut être la raison

normalement load charge tout ce qui est dans la div. Et j'ai pris soin de bien mettre le .js dans celle ci.
Je vais bien finir par trouver.
Merci Omar !

Parce quand on regarde la source de la page générée, il n'y a pas le script dedans.
Maintenant, je ne connais pas assez JQuery pour t'aider plus...

il semblerais que le probleme vienne du fait que le <script> n'est pas pris en compte dans le fichier.

Mais alors comment faire ?

Salut,

tu peux essayer de voir le plugin jquery suivant :

jxSlider

Je me suis débrouillé pour n'avoir qu'a choisir la div que tu veux transformer en navigateur et la classe des liens a faire fonctionner dans le navigateur.

Bonne utilisation