Sortable.create & Ajax.InPlaceEditor

Résolu
Signaler
Messages postés
33
Date d'inscription
mardi 23 mai 2006
Statut
Membre
Dernière intervention
28 février 2009
-
Messages postés
58
Date d'inscription
lundi 11 novembre 2002
Statut
Membre
Dernière intervention
30 octobre 2009
-
Bonsoir, J'ai malheureusement deux petits problèmes avec Script.Aculo.us :(
 commençons par le premier ;)

Sortable.create et Sortable.serialize
    Soit deux pages : Pagea.php & Pageb.php
    Pagea.php ayant comme valeur (HTML & Javascript) :
<hr size= "2" width="100%" />   

        <fieldset id="text1"><legend>Text1</legend>

        </fieldset>
        <fieldset id="text2"><legend>Text2</legend>

        </fieldset>
        <fieldset id="text3"><legend>Text3</legend>

        </fieldset>
        <fieldset id="text4"><legend>Text4</legend>

        </fieldset>
        <fieldset id="text5"><legend>Text5</legend>

        </fieldset>
   

    <script type="text/javascript" language="javascript">
     // <![CDATA[
        function Updateordre() {
         new Ajax.Request('Pageb.php', {method:'post',postBody:Sortable.serialize('conteneur', {tag:'fieldset',name:'fieldsetp'})});
         }
Sortable.create('conteneur',{tag:'fieldset',overlap:'vertical',constraint:'vertical',onUpdate:Updateordre});
       // ]]>
     </script>
<hr size="2" width="100%" />    Voila donc la Pagea est censée envoyer une requete contenant l'ordre des fieldset par une requete     XMLHttpRequest vers la Pageb seulement... rien ne se passe :s (Firebug ne trouve aucune erreur     mais ne détecte aucune requete, de plus ma pageb doit mettre a jour un champ dans une base de     donnée et ce dernier ne se met pas a jour (donc je sais qu'aucune donnée n'est transmise)

Ajax.InPlaceEditor et lui tout seul ;p
    Reprenons nos pages a et b plus haut et apportons leur des modifications ;)
    Pagea.php ayant comme valeur (HTML & Javascript) :
<hr size ="2" width="100%" />   

        <fieldset id="text1"><legend>Text1</legend>
       
Text modifiable :)


        </fieldset>
        <fieldset id="text2"><legend>Text2</legend>
       
Text modifiable :)


        </fieldset>
        <fieldset id="text3"><legend>Text3</legend>
       
Text modifiable :)


        </fieldset>
        <fieldset id="text4"><legend>Text4</legend>
       
Text modifiable :)


        </fieldset>
        <fieldset id="text5"><legend>Text5</legend>
       
Text modifiable :)


        </fieldset>
   

    <script type="text/javascript" language="javascript">
       // <![CDATA[
        new
Ajax.InPlaceEditor('textm'1,
'pageb.php?id='1,{okButton:true,okText:'Sauver',cancelLink:true,cancelText:'Annuler',savingText:'Sauvegarde
en cours, Merci de patienter !',clickToEditText:'Clic pour éditer
!',rows:10,cols:90,loadingText:'Chargement du nouveau
contenu',paramName:1,ajaxOptions:{method:'post',postBody:'var1='+???+''}}));
        new Ajax.InPlaceEditor('textm'2,
'pageb.php?id='2,{okButton:true,okText:'Sauver',cancelLink:true,cancelText:'Annuler',savingText:'Sauvegarde
en cours, Merci de patienter !',clickToEditText:'Clic pour éditer
!',rows:10,cols:90,loadingText:'Chargement du nouveau
contenu',paramName:2,ajaxOptions:{method:'post',postBody:'var2='+???+''}}));

        new Ajax.InPlaceEditor('textm'3,
'pageb.php?id='3,{okButton:true,okText:'Sauver',cancelLink:true,cancelText:'Annuler',savingText:'Sauvegarde
en cours, Merci de patienter !',clickToEditText:'Clic pour éditer
!',rows:10,cols:90,loadingText:'Chargement du nouveau
contenu',paramName:3,ajaxOptions:{method:'post',postBody:'var3='+???+''}}));

        new Ajax.InPlaceEditor('textm'4,
'pageb.php?id='4,{okButton:true,okText:'Sauver',cancelLink:true,cancelText:'Annuler',savingText:'Sauvegarde
en cours, Merci de patienter !',clickToEditText:'Clic pour éditer
!',rows:10,cols:90,loadingText:'Chargement du nouveau
contenu',paramName:4,ajaxOptions:{method:'post',postBody:'var4='+???+''}}));

         new Ajax.InPlaceEditor('textm'5,
'pageb.php?id='5,{okButton:true,okText:'Sauver',cancelLink:true,cancelText:'Annuler',savingText:'Sauvegarde
en cours, Merci de patienter !',clickToEditText:'Clic pour éditer
!',rows:10,cols:90,loadingText:'Chargement du nouveau
contenu',paramName:5,ajaxOptions:{method:'post',postBody:'var5='+???+''}}));
       // ]]>
     </script>
<hr size="2" width="100%" />    Comment puis-je faire pour que, comme précédement, je donne la main à php en lui  transferent         deux choses :
<li>En GET le numéro du champ ( de 1 a 5)</li><li>En POST le contenu du textarea d'edition (varX ou x est compris entre 1 et 5)</li>     Merci d'avoir lu jusqu'au bout :)
Bonne soirée !

3 réponses

Messages postés
33
Date d'inscription
mardi 23 mai 2006
Statut
Membre
Dernière intervention
28 février 2009

Bonsoir, J'ai déjà ce qui faut pour débugger avec firefox ;p
Probleme number one Corrigé ;) J'avais fait :
function Updateordre() {
//requete AJAX
}
function Updateordre() {
//Au lieu de UpdateText... sa me remet ma fonction a 0 et n'éffectue rien, voila pourquoi je n'avais aucun problème dans ma console !
}

Problème number two Corrigé grace à http://scriptaculous.le-developpeur-web.com/scriptaculous.demo.php

Tout de même un grand merci à vous !
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,

suite au Message Privé, je viens regarder et ... ça me semble normal
    que peu de réponses soient parvenues :

    si tu n'as pas d'erreurs de syntaxe c'est que probablement
        tu ne respecte pas celle des appels aux fonctions de Script.Aculo.us.

    il faudrait donc que je récupère ce script, regardes les fonctions appelées,
       contrôle comment toi tu t'en sert... ( c'est trop d'efforts et pas très passionnant )

    tout ce que je peux te dire c'est :







o~~~~~~~~~~~~~~~~~o~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~o~~~~~~~~~~~~~~~~o 
| Avec | et mieux : <label style="color: rgb(0, 128, 0);">Télécharger</label> | 
|~~~~~~~~~~~~~~~~~|~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|~~~~~~~~~~~~~~~~| 
|<label style="color: rgb(128, 0, 0);">FireFox</label> |regarder la "console d'erreurs" | FireBug
| | Outils / Console d'erreurs | | 
|~~~~~~~~~~~~~~~~~|~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|~~~~~~~~~~~~~~~~| 
|<label style="color: rgb(128, 0, 0);">Internet Explorer</label>|activer le deboggage : utils/options Ile Debogger IE | 
| | dans la liste, sous "Navigation" : décocher | | 
| | ° Afficher une notification de chaque erreur de script | | 
| | ° Désactiver le débogage de Scripts (autres applications)| | 
| | ° Désactiver le débogage de Scripts (Internet Explorer) | | 
o~~~~~~~~~~~~~~~~~o~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~o~~~~~~~~~~~~~~~~o





    fais du pas à pas...


    fais des essais aussi avec IE,
            parfois on détecte plus facilement ce qui se passe.
  
    et si tu n'y parviens pas, reviens à des choses plus simples que Script.Aculo.us
       fais les fonctions ajax toi-même. ce n'est pas si compliqué.
   
<hr />
Cordialement            Bul     [mon Site]     [M'écrire]
<hr />
Messages postés
58
Date d'inscription
lundi 11 novembre 2002
Statut
Membre
Dernière intervention
30 octobre 2009

Pas mal du tout ton code, tu seras d'accord de le partager ?

Merci beaucoup

Boulika webdesign