Hvordan redigere på plass på Java Script Med Ajax

Hvordan redigere på plass på Java Script Med Ajax


AJAX har mange funksjonelle bruksområder, for eksempel innhold og form redigering. Det fungerer med ulike programmerings plattformer og teknologier, inkludert PHP, ASP og Javascript, fordi det er en åpen kildekode-program. Mange web-designere og administrasjoner bruker AJAX-drevne verktøy for å krydre sine nettsider og gjøre dem mer interaktiv. De fleste av disse AJAX verktøyene er gratis, og du kan bruke og se dem i aksjon uten å oppdatere hele websiden.

Bruksanvisning

1 Bruk koden for å etablere din AJAX syntaks:

ny Ajax.InPlaceEditor (element, URL, {alternativer});

Denne konstruktøren har tre viktige parametere: element, URL og opsjoner. Elementet parameteren støtter in-place redigering handling; URL-parameteren godtar endret eller oppdatert verdi; og den tredje element er hvor du bruker ulike alternativer for å samhandle mer åpent med brukerne.

2 Oppbevar "InPlaceEditor" inne i en variabel for å tillate deaktivering og aktivering på vilje senere:

Var redaktør = new Ajax.InPlaceEditor ( 'PRODUCT_1', ...);

(... Gjøre ting ..)

editor.dispose ();

Bruk denne koden hvis du ønsker å tvinge den til å gå til redigeringsmodus til enhver tid:

editor.enterEditMode ( "klikk");

3 Påfør kode for å aktivere en enkelt linje redigeringsmodus script. Kontroller at URL "demoajaxeditor.html" erstattes med din egen for å se den i aksjon:

<P id = "editme"> Klikk meg på andre tanker! </ P>

<Script type = "text / javascript">

ny Ajax.InPlaceEditor ( 'editme', '/demoajaxeditor.html');

</ Script>

4 Sett inn koden for å bruke flere linjer redigeringsmodus script. Bytt ut URL "demoajaxeditor.html" med din egen for å se dens effekt:

<P id = "editme2"> Klikk meg til å redigere denne fin lang tekst. </ P>

<Script type = "text / javascript">

ny Ajax.InPlaceEditor ( 'editme2', '/demoajaxeditor.html', {rader: 15, Cols: 40});

</ Script>

5 Bruk koden for å aktivere egendefinerte koder for InPlaceEditor skriptet:

ny Ajax.InPlaceEditor (id, URL, {

tilbakeringing: function (form, verdi) {return 'item = 123 og gjødsel = Beskrivelse minparam =' + encodeURIComponent (verdi)},

onEnterEditMode: function (form, verdi) {// definert kode går her ...}

onLeaveEditMode: function (form, verdi) {// definert kode går her ...}

});

Hint

  • Lær så mange online AJAX opplæringsprogrammer for å bli kjent med denne funksjonelle Web verktøyet. Delta i diskusjonsfora for å få nyttige råd fra erfarne brukere.
  • Alltid sette datamaskinen til å kode i UTF-8, for å behandle skjemadata skal. Andre koding metoder kan fungere, men dette er den sikreste ett.