Buonasera a tutti,

Innanzitutto non so se questa sia la gisuta sezione per porvi la mia domanda dato che riguarda sia il alto client (javascript ajax) sia il lato server (php), dunque se non lo fosse pregherei i cortesi moderatori di spostarmi nella corretta sezione, grazie.

Premesso cio vorrei porvi una questione che molti di voi sicuramente prenderanno per banale, ma purtroppo, dato le mie scarse conoscenze sui linguaggi di programmazione (oltre al linguaggio html e css), sto riscontrando non pochi problemi nel capire come funzioni questo plugin dato che fa uso di file js ajax e php.

Il plugin di cui vi parlo è il famoso Jeditable http://www.appelsiini.net/projects/jeditable
il quale permette di modificare vari form "in palce", (questa è una demo live del plugin http://www.appelsiini.net/projects/j...e/default.html). Dal link che vi ho postato è possibile scaricare tutti i file sorgente di tale codice, ma purtroppo, una volta scaricati non riesco a capire come si faccia ad implementarli in una normalissima pagina web, quale puo essere ad esempio questa:

codice:
<!DOCTYPE HTML> <html> 

<link href="http://www.appelsiini.net/stylesheets/main2.css" rel="stylesheet" type="text/css" />
<link rel="alternate" type="application/atom+xml" href="http://feeds.feedburner.com/tuupola" title="Atom feed" />
<script src="/mint/?js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.jeditable.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">

$(function() {
        
  $(".editable_select").editable("http://www.appelsiini.net/projects/jeditable/php/save.php", { 
    indicator : '[img]img/indicator.gif[/img]',
    data   : "{'Lorem ipsum':'Lorem ipsum','Ipsum dolor':'Ipsum dolor','Dolor sit':'Dolor sit'}",
    type   : "select",
    submit : "OK",
    style  : "inherit",
    submitdata : function() {
      return {id : 2};
    }
  });
  $(".editable_select_json").editable("http://www.appelsiini.net/projects/jeditable/php/save.php", { 
    indicator : '[img]img/indicator.gif[/img]',
    loadurl : "http://www.appelsiini.net/projects/jeditable/php/json.php",
    type   : "select",
    submit : "OK",
    style  : "inherit"
  });
  $(".editable_textarea").editable("http://www.appelsiini.net/projects/jeditable/php/save.php", { 
      indicator : "[img]img/indicator.gif[/img]",
      type   : 'textarea',
      submitdata: { _method: "put" },
      select : true,
      submit : 'OK',
      cancel : 'cancel',
      cssclass : "editable"
  });
  $(".editable_textile").editable("http://www.appelsiini.net/projects/jeditable/php/save.php?renderer=textile", { 
      indicator : "[img]img/indicator.gif[/img]",
      loadurl   : "http://www.appelsiini.net/projects/jeditable/php/load.php",
      type      : "textarea",
      submit    : "OK",
      cancel    : "Cancel",
      tooltip   : "Click to edit..."
  });
  
  $(".click").editable("http://www.appelsiini.net/projects/jeditable/php/echo.php", { 
      indicator : "[img]img/indicator.gif[/img]",
      tooltip   : "Click to edit...",
      style  : "inherit"
  });
  $(".dblclick").editable("http://www.appelsiini.net/projects/jeditable/php/echo.php", { 
      indicator : "[img]img/indicator.gif[/img]",
      tooltip   : "Doubleclick to edit...",
      event     : "dblclick",
      style  : "inherit"
  });
  $(".mouseover").editable("http://www.appelsiini.net/projects/jeditable/php/echo.php", { 
      indicator : "[img]img/indicator.gif[/img]",
      tooltip   : "Move mouseover to edit...",
      event     : "mouseover",
      style  : "inherit"
  });
  
  /* Should not cause error. */
  $("#nosuch").editable("http://www.appelsiini.net/projects/jeditable/php/echo.php", { 
      indicator : "[img]img/indicator.gif[/img]",
      type   : 'textarea',
      submit : 'OK'
  });

});
</script>
<head> 
<meta charset="UTF-8"> <title>Prova Jeditable</title> 

</head>
  <body> 
<h2>questa qui sotto è la textarea</h2>
    
    <p class="editable_textarea" id="paragraph_1">vbnmnb</p>

<h2>Frasi modificabili</h2>
    


      <b class="click" style="display: inline">Mi modifico con un clik[/b]</> mentre 
      <b class="dblclick" style="display: inline">io mi modifico con due click[/b] infine
      <b class="mouseover" style="display: inline">io mi modifico quando mi evidenzi[/b]...
    </p>
Da quello che ho capito bisogna attribuire ai vari tag determinate class a seconda del risultato che si vuole ottenere. Ovvero se vorrei ottenere una textarea modificabile usero la class="editable_textarea" mentre per ottenere una sola riga modificabile con un doppio click usero la class="dblclick" e cosi via. E fin qui ci sono, ma non riesco a capire la parte successiva ovvero come far comunicare questi cambiamenti in modo dinamico con il server. Dovrei usare uno script php? Se si, qualcuno potrebbe gentilmente spiegare come si fa?

Grazie a chiunque volesse aiutarmi.

P.S. Non ho allegato i vari codici .js solamente per non rendere il mio post troppo lungo, se qualcuno volesse aiutarmi ma non ha tempo da perdere nello scaricare tali file puo tranquillamente chiedermelo, provvedero ll piu presto possibile nel postarli cosi da non farvi aprire altre pagine web.