jQuery.info
Découvrir et utiliser jQuery, la librairie javascript du XXIIème siècle

Accueil du site > Plugins > Le plugin « editable »

Le plugin « editable »

samedi 19 août 2006, par Fil

Des interfaces très fluides, c’est possible !


Voici enfin une révolution dans les interfaces Web : l’édition « en place » de contenu, sans passer par une page spécifique avec un formulaire d’édition. Dylan Verheul a écrit un plugin pour jQuery qui permet de faire ça en quelques lignes de code. Impressionnant !

Son code est disponible à l’adresse :
— http://www.dyve.net/jquery/?editable

J’ai fait aussi un exemple complet, directement tiré du sien, qui montre les données telles qu’elles sont reçues par le serveur après édition d’un champ.

Le code est simplissime :

  • d’abord, charger le plugin (ici je l’ai recopié sur mon site) :

<script src="/scripts/jquery_editable.js"></script>

  • ensuite, dire à jQuery d’appliquer la fonction editable() à chaque paragraphe possédant la classe editor :
<script type="text/javascript"><!--
$(document).ready(function() {
 $(".editor").editable("/scripts/show_post.php",
    { extraParams:{page:'editable'} }
 );
});
// --></script>
  • enfin, indiquer quels sont les paragraphes éditables :
<p class="editor">Un paragraphe editable</p>
<p>Un paragraphe non &eacute;ditable</p>
<p class="editor">Un autre paragraphe &eacute;ditable.</p>

Et hop !

Documents joints

Répondre à cet article

5 Messages de forum

  • (logo)

    Le plugin « editable »

    21 août 2006 16:59, par Gérard T.

    Je confirme : c’est impressionnant et en plus c’est tout léger et en plus ça s’installe en 5mn.

    J’ai testé pas mal de frameworks ajax ces derniers temps et j’étais passé complètement à coté de jQuery : merci pour l’info sur spip-dev !

    Répondre à ce message

    • (logo)
      Le plugin « editable » ephemere ? 14 juillet 2008 18:01, par aimejie

      Sans blaguer ce script est magnifique, comme tant d’autres d’ailleurs chez Jquery.
      un petit probleme est quand meme apparu, c’est qu’au bout de 48 h maxi les sauvegardes faites via ce script disparaissent et je retrouve le fameux "Edit me !" a la place des textes precedement ecris !!!!
      Quelqu’un porrait m’aider svp, ou faut il payer qqchose..
      Merci a vous

      Répondre à ce message

  • (logo)

    Le plugin « editable »

    4 septembre 2006 17:25, par mortimer

    Salut,

    il est sympa ce site ;)

    le code est assez soupe alphabet, mais apres une lecture profonde (et au vue de la variable POST que tu affiches), ya toujours un truc que je capte pas :
    le script n’envoie que le paragraph qui a été édité, sans preciser de quel paragraph il s’aggit... comment à ce moment là utiliser cette information pour enregistrer les modifications ?

    si on édite plusieurs article sur la même page, il nous faudrait un id de l’article, c’est le même cas si on édite des paragraphes d’un seul article. Il faudrait peut être passer l’id du paragraphe édité en paramètre au POST, non ?
    (rien de tres complexe, par exemple, ajouter avant le load ,un p[i.name+'_id'] =i.id et ajouter un parametre à la creation du champ pour transferer l’id du paragraphe au champ (pas tres propre dans ce cas là parce qu’on aurait deux éléments avec le mm id, mais c’est l’id :D)

    Répondre à ce message

    • Le plugin « editable » 4 septembre 2006 17:55, par Fil

      Oui c’est un exemple basique ; l’idée de jquery.info, dans un premier temps, c’est de montrer comment on utilise les outils, pas de donner des produits finis.

      Répondre à ce message


Derniers commentaires