SlideShare uma empresa Scribd logo
1 de 42
JAMP DAY 22 Maggio 2010 Relatori: Ruben Patanè Giampiero Ancilletta Università degli Studi di Roma "Tor Vergata"
[object Object]
TRANSAZIONE HTTP WEB BROWSER SERVER-SIDE Gestisce interfaccia utente Elaborazione delle richieste HTTP is stateless  ,[object Object],[object Object],HTTP request Response
CLASSIC AND AJAX WEB APPLICATION Permette uno scambio di dati in background fra web browser e server. AJAX permette un risparmio di tempo e banda
INVIARE UNA RICHIESTA TRAMITE UN FORM < idform  typeobj=&quot; form &quot; action=“ mypage.php &quot; method=“ post “>   < idtag1  type =“ text ” value=“ param1 ” name=“ field1 ” /> < idtag2  type =“ hidden ” value=“ val ” name=“ hiddenfield ” /> ………………………… </ idform > < idtag  type =“a” href=“mypage.php?field1=val1&field2=val2” text=“link” /> function  html_load()  {     $_SESSION ['param1'] =  $_POST ['param1'];     $_SESSION ['param2'] =  $_POST ['param2'];  }  < page  type =“page” fowardrequest=“ true ” /> INVIARE UNA   RICHIESTA   TRAMITE UN URL LEGGERE I DATI
INVIARE UNA RICHIESTA   TRAMITE AJAX In JAMP la classe javascript  AJAX (js/ajax.js), contiene tutti i metodi necesssari a gestire le transazioni AJAX: ,[object Object],[object Object],[object Object],Metodo AJAX. request (method, page, param, sync, returnxml);   method:  GET o POST page:   Nome della pagina a cui inviare la risposta params:   Parametri da inoltrare al server web sync:   Transazione sincrona/asincrona(booleano true|false) returnxml:  Restituzione codice XML(booleano true|false)
GESTIONE DELLE TRANSAZIONI IN JAMP STANDARD  REQUEST WEB BROWSER CUSTOM  REQUEST STANDARD  ACTION CUSTOM  ACTION WEB SERVER HTTP request Response HTTP request Response
RICHIESTA DATI Tutti i dati del datasourse ds1: params = 'data=load&dsobjname=ds1‘; AJAX.request( ' POST ' ,  ' mypage.php ' ,  params , false, true);   ,[object Object],[object Object],[object Object],[object Object],[object Object],Tutti i dati del datasourse ds1,ds2,..,dsn: params = 'data=load&dsobjname=ds1,ds2,..,dsn';   Tutti i dati dei datasourse presenti nella pagina: params = 'data=loadall';
RICHIESTA DATI CON FILTRO Filtro per singola transazione sul datasource ds1: params =   'data=load&dsobjname=ds1&dswhere='+encodeURIComponent('field=fieldvalue');   AJAX.request( ' POST ' ,  ' mypage.php ' ,  params , false, true);   ,[object Object],[object Object],[object Object],[object Object],[object Object],Filtro permanente sul datasource ds1: dsObj.DSsearch = ‘field='+encodeURIComponent(fieldvalue); AJAX.dsmore(dsObj, 'data=load&dsobjname=ds1');
RICHIESTA MODIFICA DATI Richiesta di inserimento dati: params = 'data=new&dsobjname=ds1&nome=mario&cognome=rossi';   AJAX.request( ' POST ' ,  ' mypage.php ' ,  params , true, true|false);   ,[object Object],[object Object],[object Object],[object Object],[object Object],Richiesta di aggiornamento dati: params = 'data=update&dsobjname=ds1&cognome=verdi&keyname=id&keynamevalue=5';  Richiesta di cancellazione dati: params =   'data=delete&dsobjname=ds1&keyname=id&keynamevalue=5’;
RICHIESTA CUSTOM Richiesta di inserimento dati: params = 'data=myfunction&param1=value1...&paramn=valuen'; AJAX.request( method , page,  params , sync, returnxml); La stringa params contiene nel parametro data il nome della funzione da richiamare: In una richiesta custom il parametro data non può  assumere valori di parole  chiave riservate come:  &quot;loadall&quot;,&quot;load&quot;,&quot;update&quot;, &quot;new&quot;,&quot;delete&quot;,&quot;deleteall&quot;, ecc. Richieste per le quali non è prevista un risposta da parte del framework. function  myfunction() { global   $event ; $code  = “alert(‘OK’);”; $event - >returnRequest(&quot;&quot;,  $code );   } RISPOSTA CUSTOM
INTERCETTARE UNA RICHIESTA PRIMA DELL'AZIONE DA PARTE DEL FRAMEWORK function   data_select_before( $ds )   {       global   $xml ;      if ( $ds ->getPropertyName(&quot;id&quot;) == &quot;ds1&quot;)       {           $result  = array();           $result [0][&quot;field1&quot;] = &quot; value1 &quot;;           $result [0][&quot;field2&quot;] = &quot; value2 &quot;;           $result [1][&quot;field1&quot;] = &quot; value3 &quot;;           $result [1][&quot;field2&quot;] = &quot; value4 &quot;;           $ds ->setProperty(&quot;xml&quot;, $xml->dataJSON($result));             //$ds->setProperty(&quot;xml&quot;, $xml>dataXML($result));            return  false;   // interrompe l'esecuzione del codice      }  }
INTERCETTARE UNA RICHIESTA DOPO AZIONE DA PARTE DEL FRAMEWORK function   data_select_after( $ds )   {       global   $xml ;       if ( $ds ->getPropertyName(&quot;id&quot;) == &quot; ds1 &quot;)       {    $i =0; $result  = array(); while( $ds ->ds->dsGetRow()) { $result[ $i ][' field1 '] =  $ds ->ds->property[&quot; row &quot;]->field1; if ( $result [ $i++ ][' field1 ']==&quot; value1 &quot;) $result[ $i ][' field2 '] = &quot; YES &quot;; else  $result [ $i++ ][' field2 '] = &quot; NO &quot;; }        $ds ->setProperty(&quot;xml&quot;,  $xml ->dataJSON( $result ));     }  }
RICHIESTA DI REWRITE OBJECT Sorgente XML: <select1 typeobj=&quot;dsselect&quot; label=&quot;Select:&quot; /> <dsbutton typeobj=&quot;button&quot; value=&quot;REWRITE OBJ&quot; onclick=&quot;AJAX.rewriteObj('select1', 'page.php')&quot; /> Sorgente PHP: function   data_select_after( $select )   {  $select ->setProperty(&quot;optiontext&quot;, array(&quot;new1&quot;, &quot;new2&quot;)); $select ->setProperty(&quot;optionvalue&quot;, array(&quot;newval1&quot;, &quot;newval2&quot;)); } Permette di sostituire un oggetto già presente nella pagina.
RISPOSTA DA PARTE DEL SERVER <? xml  version=&quot;1.0&quot; encoding=&quot;utf-8&quot;> < data > < html  id=&quot;dsselect1&quot;> <![ CDATA [ < div  style=&quot;display:inline;&quot; id=&quot;dsselect1_container&quot;> < label >Select:</ label > < select  onchange=&quot;DSSELECT.change(this); &quot; id=&quot;dsselect1&quot;>   < option  value=&quot;newval1&quot;>new1</ option > </ select > </ div >   ]]> </ html > < script > <![ CDATA [ $ (' ds2 ').DSresult = [ { ID :&quot;1&quot;, DENOMINAZIONE_COMUNE :&quot;AGRIGENTO&quot;, CAB :&quot;16601&quot;} AJAX .setDsJSON('ds1',0,1,8109,1);]]> </ script> < ds1  start=&quot;0&quot; end=&quot;0&quot; limit=&quot;0&quot; tot=&quot;1&quot; action=&quot;/jamp/frm/jamptree.php&quot; order=&quot;&quot;> < row > < id >jamp</ id > < nome >base</ nome > < cognome >false</ cognome > </ row > </ ds1 > </ data > <script> Tutto quello contenuto  al suo interno viene  eseguito tramite eval <html> Per sostituire un oggetto,  attualmente usato dalla  funzione rewrite [DATA] Tutto il resto viene  interpretato come dati e  caricato nella struttura  del tag corrispondente
LETTURA DEI DATI CONTENUTI IN UN DS $('ds1').DSresult[row][fieldname]  // array bidimensionale contenente i dati $('ds1').DSchange  // indica se i campi del DS sono stati modificati dall'utente flag(true|false) $('ds1').DSMultipos  // Multi selezione di record(esempio tenendo premuto SHIFT in una gridds) $('ds1').DSpos  // posizione cursore di record $('ds1').DSsearch  // Permette di impostare un filtro $('ds1').DSpre  // Posizione cursore record prededente $('ds1').DSrow  // Numero totale di righe $('ds1').DSlimit  // Equivale all'attributo dslimit impostato nel XML $('ds1').DSstart  // Posizione primo record $('ds1').DSend  // Posizione dell'ultimo record $('ds1').p.DSaction  // Pagina di destinazione della richiesta $('ds1').p.DSengine  // Tipo di engine(es. mysql, xml, ldap, ecc) $('ds1').p.DSkey  // Nome campo chiave $('ds1').p.DSorder  // Nome campo/i per l'ordinamento $('ds1').p.DSreferences  // Nome del ds padre $('ds1').p.DSreferenceskey  // Nome del campo del ds padre relazionato con ds corrente $('ds1').p.DSforeignkey  // Nome del campo del ds corrente relazionato con ds padre $('ds1').p.DSsavetype  // modalità di salvataggio row, table, live $('ds1').p.typeObj  // tipo di oggetto ds < ds1  typeobj=&quot;ds&quot; ..... />
[object Object]
LA FORMATTAZIONE DEI DATI Tecnica con la quale un dato “grezzo” può essere presentato in maniera diversa fornendo sempre la stessa informazione 20100522 22/05/2010 05-22-2010 22 Maggio 2010 5-22-10
LA FORMATTAZIONE IN JAMP ,[object Object],[object Object],[object Object],[object Object],La formattazione di date e numeri è completamente reversibile 1,000.00 1.000,00 1.200,20 1,200.20 Formattazione output Formattazione input Modifica dato
FORMATTAZIONE DATE E ORA Sintassi:   date |lingua|formato|lingua|formato < text  typeobj=”text” format=” date |EN|yyyy-mm-dd|IT|dd/mm/yyyy” /> Formato input Formato ouput Dato originale Format Output 20100522 EN|yyyy|mm|dd|IT|dd/mm/yyyy 22/05/2010 20100522 EN|yyyy|mm|dd|IT|dd mmm yyyy 22 Maggio 2010 20100522 EN|yyyy|mm|dd|IT|mm-dd-yyyy 05-22-2010 20100522 EN|yyyy|mm|dd|IT|m-dd-yy 5-22-10
FORMATTAZIONE NUMERI Sintassi:   number |lingua|formato|lingua|formato < text  typeobj=”text” format=” number |EN|,0.00|IT|.0,00” /> Formato input Formato ouput Lingua:   EN separatore delle migliaia(,) delle decine(.) IT  separatore delle migliaia(.) delle decine(,) Dato originale Format Output 10,012.345.67890 EN|,00000|IT|0 10012346 10,012.345.67890 EN|,00000|IT|0,0 10012345,6 10,012.345.67890 EN|,00000|IT|0,00 10012345,67 10,012.345.67890 EN|,00000|IT|.0,000000 10.012.345,678900
FORMATTAZIONE STRINGHE Sintassi:   string |[lower][upper][trim][!][@@@@] < text  typeobj=”text” format=” string |upper” /> Formato ouput Lingua:  lower:  trasforma tutti i caratteri in minuscolo upper: trasforma tutti i caratteri in maiuscolo trim:  elimina gli spazi alla sinistra e destra della stringa @: se lunghezza stringa < aggiunge degli spazi alla sua destra !: da usare con @ se lunghezza stringa < aggiunge degli spazi alla sua sinistra Dato originale Format Output Jamp string|lower jamp Jamp string|upper JAMP
INPUT CONTROLLATO JAMP prevede la validazione dei dati inseriti dagli utenti. VALIDAZIONE DIGIT VALIDAZIONE STRINGA VALIDAZIONE DATASOURCE
VALIDAZIONE SINGOLO DIGIT L'espressione regolare va specificata nell'attributo  keypress.   number   // Solo caratteri numerici nonumber   // Escluso caratteri numerici alphanumeric // Solo caratteri alphanumerici noalphanumeric // Escluso caratteri alphanumerici alphabetic // Solo caratteri alfabetici loweralphabetic // Solo caratteri alfabetici minuscoli upperalphabetic // Solo caratteri alfabetici maiuscoli decimal // Solo caratteri decimali permission // Numerico da 0-7  < id  typeobj=&quot;text&quot; maxlength=” 10 ” /> < id  typeobj=&quot;text&quot; keypress=&quot; [a-dA-P] &quot; /> Espressioni regolari predefinite: < id  typeobj=&quot;text&quot; keypress=&quot; number &quot; /> Lunghezza massima:
VALIDAZIONE STRINGA Attributo da utilizzare  blur  nel quale specificare l'espressione regolare. number // Solo caratteri numerici decimal // Solo caratteri decimali ip // Indirizzo IP email // Indirizzo e-mail cf // Codice fiscale piva // P.Iva permission // Permission < id  typeobj=&quot;text&quot; blur=&quot; email &quot; /> < id  typeobj=&quot;text&quot; blur=&quot; ^[0-6]$ &quot; /> Espressioni regolari predefinite: < id  typeobj=&quot;text&quot; minlength=” 3 ” /> Lunghezza minima:
VALIDAZIONE DATASOURCE $DS_VALIDATE_RULE [&quot; idds &quot;]= &quot; Codice JS &quot;;  <?php $DS_VALIDATE_RULE [&quot;ds3&quot;]= &quot; var dsObj = $('ds3'); var items = dsObj.DSresult[dsObj.DSpos]; if (items['votanti'] > 100) { alert('ATTENZIONE! Numero di voti non validi '); return false; } return true;”; ?>
[object Object]
STRUTTURA DEI TEMPLATE Definito nella costante  TEMPLATE Framework Page object < idob  typeobj=” typeobj ” template=” template ” /> <page typeobj=” page ” template=” template ” /> Livello applicazione: < idob  typeobj=” xmlpage ” src=” mypage.php ” /> <page typeobj=” page ” template=” template ” />
[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],La classe exception.class.php intercetta gli errori generati dal PHP tramite: set_exception_handler(array($this, 'ExceptionHandler')); set_error_handler(array($this, 'ErrorHandler')); function  before_exception_error( $exception )  { $exception ->param[' errno '] = “.....”; $exception ->param[' message '] = “.....”;  $exception ->param[' errfile '] = “.....”; $exception ->param[' errline '] = “.....”; $exception ->param[' title '] = “.....”; return  false ; // disabilita il comportamento di default(die)‏ } function  after_exception_error( $exception )  { // i parametri  $exception ->param sono disponibili in sola lettura. return  false ; // disabilita il comportamento di default(die)‏ }
[object Object],Errori generati dal framework a seguito del fallimento di un comando ritenuto critico. ClsError::showError(&quot;ERROR_CODE&quot;, [param]); ERROR_CODE : è il codice dell'errore, si utilizza un codice per la gestione della lingua. Le descrizioni degli errori si trovano nei files class/lang/[LANGUAGE].php(la costante LANGUAGE è definita nel file conf/setting.inc.php)‏ [param]: parametro aggiuntivo che può essere aggiunto all'errore per dare maggiori dettagli. Esempio:  ClsError::showError(&quot;DS00&quot;, “”MYSQL”);
[object Object],La classe exception.class.php intercetta gli errori generati dal PHP tramite: function  before_error()  { ClsError:: $param[ ' title '] = &quot;........&quot;; ClsError:: $param[ ' message '] = &quot;........&quot;; ClsError:: $param[ ' errno '] = &quot;........&quot;; ClsError:: $param[ ' obj '] = &quot;........&quot;; ClsError:: $param[ ' extra '] = &quot;........&quot;; return  false ; // disabilita il comportamento di default(die)‏ } function  after_error()  { // i parametri ClsError:: $param  sono disponibili in sola lettura. return  false ; // disabilita il comportamento di default(die)‏ }
[object Object],Nel file  conf/setting.inc.php  definiamo le costanti: FASE DI SVILUPPO define ( &quot;LANGUAGE&quot; ,  “ IT ” ); define (&quot;ERROR_LEVEL&quot;,  1 ); define (&quot;ERROR_REPORTING&quot;,  E_ALL|E_STRICT ); FASE DI DEPLOY define (&quot;ERROR_LEVEL&quot;,  0 );
[object Object],Errori generati a seguito di una transazione AJAX o durante il parsing del dati inviati dal server. errorXML  : function(message) { ............ } Intercettare l'evento: function  xml_error(message) { ............. return false; } SYSTEMEVENT .addBeforeCustomFunction('SYSTEMEVENT','errorXML', 'xml_error');
[object Object],Sono errori generati durante l'esecuzione di codice javascript e vengono intercettati da JAMP tramite: window.onerror = SYSTEMEVENT.errorJAVASCRIPT; Non tutti i browser gestiscono l'evento window.error errorJAVASCRIPT  : function(message, url, row) { ............ } Intercettare l'evento: function  js_error(message, url, row) { ............. } window.onerror =  js_error;
[object Object],Per facilitare le operazioni di controllo e debug del codice e delle transazione AJAX, JAMP mette a disposizione la versione lite del famoso tool &quot;firebug&quot;.  In JAMP oltre all'integrazione sono state effettuate delle castomizzazioni per sfruttare al massimo le potenzialità di questo validissimo strumento, tra le molte funzionalità offerte abbiamo: * Eseguire dei comandi in javascript da console. * Visualizzare le transazioni codice oggetti. * Visualizzare codice oggetti JAMP. * Visualizzare le transazioni AJAX. * Visualizzare i fogli di stile. * Visualizzare il codice javascripts. * Struttura DOM della pagina. * Modificare in real-time aspetti relativi ad una pagina web e vedere subito i risultati ottenuti.
[object Object],L'oggetto  graphic  permette di realizzare dei grafici all'interno di una pagina web o di un report pdf.  I grafici sono realizzati grazie all'integrazione di JAMP con le librerie  jpgraph. Attualmente supportati: Istogrammi Lineari Diagramma a torna, di Gantt e Polare Radar Scatter Stock Castomizzati
[object Object],<graphic typeobj=&quot;graphic&quot; width=&quot;....&quot; height=&quot;....&quot; scale=&quot;....&quot;> <parameter> .......................... .......................... .......................... .......................... </parameter> </graphic> I dati innerenti i grafici possono essere inseriti: Manualmente: <bar objtype=&quot; bar &quot; data=&quot; 30,22,8,10,15,24 &quot;  /> Con datasource: <bar objtype=&quot; bar &quot; dsobj=&quot; dsa &quot; dsitem=&quot; fieldname &quot; /> <bar objtype=&quot; bar &quot; dsobj=&quot; dsb &quot; dsitem=&quot; fieldname &quot; />
[object Object],<page typeobj=” page ” out=” pdf ” /> In JAMP i report sono realizzati tramite integrazione con la classe  fdpf. Differenze tra output html e pdf La creazione di un pdf avviene in un unica fase Disposizione degli oggetti avviene attraverso coordinate assolute(attributo style)
[object Object],<page typeobj=” page ” out=” pdf ” /> Corpo Pié di pagina Piè report < pageheader  typeobj=&quot;header&quot;> .................. </ pageheader>   < body  typeobj=&quot;gridds o xgridds&quot;> .................. </ body >  < pagefooter  typeobj=&quot;footer&quot;> .................. </ pagefooter >  Intestazione report Intestazione pagina Prima del page header Dopo pagefooter

Mais conteúdo relacionado

Destaque

Slidesharefor
SlideshareforSlidesharefor
SlideshareforYerele
 
Gartner A Portfolio
Gartner A PortfolioGartner A Portfolio
Gartner A Portfoliofoxlika
 
Al’S Pizza Mandarin
Al’S Pizza   MandarinAl’S Pizza   Mandarin
Al’S Pizza Mandarinwesnic
 
Huw Davies Better By Design V3
Huw Davies Better By Design V3Huw Davies Better By Design V3
Huw Davies Better By Design V3Marina111
 
JAMP al barcamp CATANIA 2009
JAMP al barcamp CATANIA 2009JAMP al barcamp CATANIA 2009
JAMP al barcamp CATANIA 2009jampslide
 
Young American Jan 2010
Young American Jan 2010Young American Jan 2010
Young American Jan 2010KjerstiOfstad
 
Podcasting In Education
Podcasting In EducationPodcasting In Education
Podcasting In EducationBlwalter
 
Webquest 'O folklore'
Webquest 'O folklore'Webquest 'O folklore'
Webquest 'O folklore'Olga Veiga
 
Facebook, twitter och instagram - på Berghs 27 november 2013
Facebook, twitter och instagram - på Berghs 27 november 2013Facebook, twitter och instagram - på Berghs 27 november 2013
Facebook, twitter och instagram - på Berghs 27 november 2013Hanna Metsis
 
Fuel Cell Vehicles
Fuel Cell VehiclesFuel Cell Vehicles
Fuel Cell Vehiclesguestc4c2a3
 
Elementos da aula Abalar
Elementos da aula AbalarElementos da aula Abalar
Elementos da aula AbalarOlga Veiga
 
Presentation1
Presentation1Presentation1
Presentation12jam21
 
Canadian Retail Conference
Canadian Retail ConferenceCanadian Retail Conference
Canadian Retail ConferenceAndre Theriault
 
Reilly Studios Portfolio
Reilly Studios PortfolioReilly Studios Portfolio
Reilly Studios PortfolioRon Reilly
 
Iain Stewart Architectural Watercolors
Iain Stewart Architectural WatercolorsIain Stewart Architectural Watercolors
Iain Stewart Architectural Watercolorsbookanow
 

Destaque (19)

Slidesharefor
SlideshareforSlidesharefor
Slidesharefor
 
Gartner A Portfolio
Gartner A PortfolioGartner A Portfolio
Gartner A Portfolio
 
Al’S Pizza Mandarin
Al’S Pizza   MandarinAl’S Pizza   Mandarin
Al’S Pizza Mandarin
 
Udfordringen
UdfordringenUdfordringen
Udfordringen
 
Titanic
TitanicTitanic
Titanic
 
Huw Davies Better By Design V3
Huw Davies Better By Design V3Huw Davies Better By Design V3
Huw Davies Better By Design V3
 
JAMP al barcamp CATANIA 2009
JAMP al barcamp CATANIA 2009JAMP al barcamp CATANIA 2009
JAMP al barcamp CATANIA 2009
 
Young American Jan 2010
Young American Jan 2010Young American Jan 2010
Young American Jan 2010
 
Podcasting In Education
Podcasting In EducationPodcasting In Education
Podcasting In Education
 
Webquest 'O folklore'
Webquest 'O folklore'Webquest 'O folklore'
Webquest 'O folklore'
 
Facebook, twitter och instagram - på Berghs 27 november 2013
Facebook, twitter och instagram - på Berghs 27 november 2013Facebook, twitter och instagram - på Berghs 27 november 2013
Facebook, twitter och instagram - på Berghs 27 november 2013
 
Fuel Cell Vehicles
Fuel Cell VehiclesFuel Cell Vehicles
Fuel Cell Vehicles
 
Elementos da aula Abalar
Elementos da aula AbalarElementos da aula Abalar
Elementos da aula Abalar
 
Balletskolen 2014
Balletskolen 2014Balletskolen 2014
Balletskolen 2014
 
Presentation1
Presentation1Presentation1
Presentation1
 
Canadian Retail Conference
Canadian Retail ConferenceCanadian Retail Conference
Canadian Retail Conference
 
Reilly Studios Portfolio
Reilly Studios PortfolioReilly Studios Portfolio
Reilly Studios Portfolio
 
Iain Stewart Architectural Watercolors
Iain Stewart Architectural WatercolorsIain Stewart Architectural Watercolors
Iain Stewart Architectural Watercolors
 
GEOZUMBA
GEOZUMBAGEOZUMBA
GEOZUMBA
 

Semelhante a JAMP DAY 2010 - ROMA (4)

Rich Ajax Web Interfaces in Jquery
Rich Ajax Web Interfaces in JqueryRich Ajax Web Interfaces in Jquery
Rich Ajax Web Interfaces in JqueryAlberto Buschettu
 
JAMP DAY 2010 - ROMA (3)
JAMP DAY 2010 - ROMA (3)JAMP DAY 2010 - ROMA (3)
JAMP DAY 2010 - ROMA (3)jampslide
 
jQuery e i suoi plugin
jQuery e i suoi pluginjQuery e i suoi plugin
jQuery e i suoi pluginPasquale Puzio
 
Non Conventional Android Programming (Italiano)
Non Conventional Android Programming (Italiano)Non Conventional Android Programming (Italiano)
Non Conventional Android Programming (Italiano)Davide Cerbo
 
Web Performance Optimization
Web Performance OptimizationWeb Performance Optimization
Web Performance OptimizationAlessandro Martin
 
Mantenere una distribuzione Drupal attraverso test coverage: Paddle case study
Mantenere una distribuzione Drupal attraverso test coverage: Paddle case studyMantenere una distribuzione Drupal attraverso test coverage: Paddle case study
Mantenere una distribuzione Drupal attraverso test coverage: Paddle case studyDrupalDay
 
Gianfrasoft Corso Di Php Parte 2
Gianfrasoft   Corso Di Php   Parte 2Gianfrasoft   Corso Di Php   Parte 2
Gianfrasoft Corso Di Php Parte 2Gianfranco Fedele
 
breve introduzione a node.js
breve introduzione a node.jsbreve introduzione a node.js
breve introduzione a node.jseugenio pombi
 
Consigli per iniziare tdd
Consigli per iniziare tddConsigli per iniziare tdd
Consigli per iniziare tddTassoman ☺
 
Django: utilizzo avanzato e nuove funzionalità
Django: utilizzo avanzato e nuove funzionalitàDjango: utilizzo avanzato e nuove funzionalità
Django: utilizzo avanzato e nuove funzionalitàskam
 
Introduzione a jQuery
Introduzione a jQueryIntroduzione a jQuery
Introduzione a jQuerySandro Marcon
 
Progetto di Basi di Dati
Progetto di Basi di DatiProgetto di Basi di Dati
Progetto di Basi di Datisegarva
 
Web Semantico: da XHTML a RDF in 3 click
Web Semantico: da XHTML a RDF in 3 clickWeb Semantico: da XHTML a RDF in 3 click
Web Semantico: da XHTML a RDF in 3 clickSimone Onofri
 

Semelhante a JAMP DAY 2010 - ROMA (4) (20)

Rich Ajax Web Interfaces in Jquery
Rich Ajax Web Interfaces in JqueryRich Ajax Web Interfaces in Jquery
Rich Ajax Web Interfaces in Jquery
 
JAMP DAY 2010 - ROMA (3)
JAMP DAY 2010 - ROMA (3)JAMP DAY 2010 - ROMA (3)
JAMP DAY 2010 - ROMA (3)
 
jQuery e i suoi plugin
jQuery e i suoi pluginjQuery e i suoi plugin
jQuery e i suoi plugin
 
Non Conventional Android Programming (Italiano)
Non Conventional Android Programming (Italiano)Non Conventional Android Programming (Italiano)
Non Conventional Android Programming (Italiano)
 
Web Performance Optimization
Web Performance OptimizationWeb Performance Optimization
Web Performance Optimization
 
Ajax e jQuery
Ajax e jQueryAjax e jQuery
Ajax e jQuery
 
Pycon Jungle
Pycon JunglePycon Jungle
Pycon Jungle
 
Mantenere una distribuzione Drupal attraverso test coverage: Paddle case study
Mantenere una distribuzione Drupal attraverso test coverage: Paddle case studyMantenere una distribuzione Drupal attraverso test coverage: Paddle case study
Mantenere una distribuzione Drupal attraverso test coverage: Paddle case study
 
Gianfrasoft Corso Di Php Parte 2
Gianfrasoft   Corso Di Php   Parte 2Gianfrasoft   Corso Di Php   Parte 2
Gianfrasoft Corso Di Php Parte 2
 
Yagwto
YagwtoYagwto
Yagwto
 
Lezione07
Lezione07Lezione07
Lezione07
 
Oo Javascript
Oo JavascriptOo Javascript
Oo Javascript
 
breve introduzione a node.js
breve introduzione a node.jsbreve introduzione a node.js
breve introduzione a node.js
 
Consigli per iniziare tdd
Consigli per iniziare tddConsigli per iniziare tdd
Consigli per iniziare tdd
 
Django: utilizzo avanzato e nuove funzionalità
Django: utilizzo avanzato e nuove funzionalitàDjango: utilizzo avanzato e nuove funzionalità
Django: utilizzo avanzato e nuove funzionalità
 
Introduzione a jQuery
Introduzione a jQueryIntroduzione a jQuery
Introduzione a jQuery
 
Progetto di Basi di Dati
Progetto di Basi di DatiProgetto di Basi di Dati
Progetto di Basi di Dati
 
Ajax - Presente e futuro delle applicazioni web
Ajax - Presente e futuro delle applicazioni webAjax - Presente e futuro delle applicazioni web
Ajax - Presente e futuro delle applicazioni web
 
Web Semantico: da XHTML a RDF in 3 click
Web Semantico: da XHTML a RDF in 3 clickWeb Semantico: da XHTML a RDF in 3 click
Web Semantico: da XHTML a RDF in 3 click
 
Basi Di Dati 05
Basi Di Dati 05Basi Di Dati 05
Basi Di Dati 05
 

JAMP DAY 2010 - ROMA (4)

  • 1. JAMP DAY 22 Maggio 2010 Relatori: Ruben Patanè Giampiero Ancilletta Università degli Studi di Roma &quot;Tor Vergata&quot;
  • 2.
  • 3.
  • 4. CLASSIC AND AJAX WEB APPLICATION Permette uno scambio di dati in background fra web browser e server. AJAX permette un risparmio di tempo e banda
  • 5. INVIARE UNA RICHIESTA TRAMITE UN FORM < idform typeobj=&quot; form &quot; action=“ mypage.php &quot; method=“ post “> < idtag1 type =“ text ” value=“ param1 ” name=“ field1 ” /> < idtag2 type =“ hidden ” value=“ val ” name=“ hiddenfield ” /> ………………………… </ idform > < idtag type =“a” href=“mypage.php?field1=val1&field2=val2” text=“link” /> function  html_load() {    $_SESSION ['param1'] =  $_POST ['param1'];    $_SESSION ['param2'] =  $_POST ['param2']; } < page type =“page” fowardrequest=“ true ” /> INVIARE UNA RICHIESTA TRAMITE UN URL LEGGERE I DATI
  • 6.
  • 7. GESTIONE DELLE TRANSAZIONI IN JAMP STANDARD REQUEST WEB BROWSER CUSTOM REQUEST STANDARD ACTION CUSTOM ACTION WEB SERVER HTTP request Response HTTP request Response
  • 8.
  • 9.
  • 10.
  • 11. RICHIESTA CUSTOM Richiesta di inserimento dati: params = 'data=myfunction&param1=value1...&paramn=valuen'; AJAX.request( method , page, params , sync, returnxml); La stringa params contiene nel parametro data il nome della funzione da richiamare: In una richiesta custom il parametro data non può assumere valori di parole chiave riservate come: &quot;loadall&quot;,&quot;load&quot;,&quot;update&quot;, &quot;new&quot;,&quot;delete&quot;,&quot;deleteall&quot;, ecc. Richieste per le quali non è prevista un risposta da parte del framework. function myfunction() { global $event ; $code = “alert(‘OK’);”; $event - >returnRequest(&quot;&quot;,  $code ); } RISPOSTA CUSTOM
  • 12. INTERCETTARE UNA RICHIESTA PRIMA DELL'AZIONE DA PARTE DEL FRAMEWORK function data_select_before( $ds )  {      global   $xml ;     if ( $ds ->getPropertyName(&quot;id&quot;) == &quot;ds1&quot;)      {          $result  = array();          $result [0][&quot;field1&quot;] = &quot; value1 &quot;;          $result [0][&quot;field2&quot;] = &quot; value2 &quot;;          $result [1][&quot;field1&quot;] = &quot; value3 &quot;;          $result [1][&quot;field2&quot;] = &quot; value4 &quot;;          $ds ->setProperty(&quot;xml&quot;, $xml->dataJSON($result));             //$ds->setProperty(&quot;xml&quot;, $xml>dataXML($result));          return  false;   // interrompe l'esecuzione del codice     } }
  • 13. INTERCETTARE UNA RICHIESTA DOPO AZIONE DA PARTE DEL FRAMEWORK function data_select_after( $ds )  {      global   $xml ;      if ( $ds ->getPropertyName(&quot;id&quot;) == &quot; ds1 &quot;)      { $i =0; $result = array(); while( $ds ->ds->dsGetRow()) { $result[ $i ][' field1 '] = $ds ->ds->property[&quot; row &quot;]->field1; if ( $result [ $i++ ][' field1 ']==&quot; value1 &quot;) $result[ $i ][' field2 '] = &quot; YES &quot;; else $result [ $i++ ][' field2 '] = &quot; NO &quot;; }        $ds ->setProperty(&quot;xml&quot;,  $xml ->dataJSON( $result ));     } }
  • 14. RICHIESTA DI REWRITE OBJECT Sorgente XML: <select1 typeobj=&quot;dsselect&quot; label=&quot;Select:&quot; /> <dsbutton typeobj=&quot;button&quot; value=&quot;REWRITE OBJ&quot; onclick=&quot;AJAX.rewriteObj('select1', 'page.php')&quot; /> Sorgente PHP: function data_select_after( $select )  { $select ->setProperty(&quot;optiontext&quot;, array(&quot;new1&quot;, &quot;new2&quot;)); $select ->setProperty(&quot;optionvalue&quot;, array(&quot;newval1&quot;, &quot;newval2&quot;)); } Permette di sostituire un oggetto già presente nella pagina.
  • 15. RISPOSTA DA PARTE DEL SERVER <? xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;> < data > < html id=&quot;dsselect1&quot;> <![ CDATA [ < div style=&quot;display:inline;&quot; id=&quot;dsselect1_container&quot;> < label >Select:</ label > < select onchange=&quot;DSSELECT.change(this); &quot; id=&quot;dsselect1&quot;> < option value=&quot;newval1&quot;>new1</ option > </ select > </ div > ]]> </ html > < script > <![ CDATA [ $ (' ds2 ').DSresult = [ { ID :&quot;1&quot;, DENOMINAZIONE_COMUNE :&quot;AGRIGENTO&quot;, CAB :&quot;16601&quot;} AJAX .setDsJSON('ds1',0,1,8109,1);]]> </ script> < ds1 start=&quot;0&quot; end=&quot;0&quot; limit=&quot;0&quot; tot=&quot;1&quot; action=&quot;/jamp/frm/jamptree.php&quot; order=&quot;&quot;> < row > < id >jamp</ id > < nome >base</ nome > < cognome >false</ cognome > </ row > </ ds1 > </ data > <script> Tutto quello contenuto al suo interno viene eseguito tramite eval <html> Per sostituire un oggetto, attualmente usato dalla funzione rewrite [DATA] Tutto il resto viene interpretato come dati e caricato nella struttura del tag corrispondente
  • 16. LETTURA DEI DATI CONTENUTI IN UN DS $('ds1').DSresult[row][fieldname] // array bidimensionale contenente i dati $('ds1').DSchange // indica se i campi del DS sono stati modificati dall'utente flag(true|false) $('ds1').DSMultipos // Multi selezione di record(esempio tenendo premuto SHIFT in una gridds) $('ds1').DSpos // posizione cursore di record $('ds1').DSsearch // Permette di impostare un filtro $('ds1').DSpre // Posizione cursore record prededente $('ds1').DSrow // Numero totale di righe $('ds1').DSlimit // Equivale all'attributo dslimit impostato nel XML $('ds1').DSstart // Posizione primo record $('ds1').DSend // Posizione dell'ultimo record $('ds1').p.DSaction // Pagina di destinazione della richiesta $('ds1').p.DSengine // Tipo di engine(es. mysql, xml, ldap, ecc) $('ds1').p.DSkey // Nome campo chiave $('ds1').p.DSorder // Nome campo/i per l'ordinamento $('ds1').p.DSreferences // Nome del ds padre $('ds1').p.DSreferenceskey // Nome del campo del ds padre relazionato con ds corrente $('ds1').p.DSforeignkey // Nome del campo del ds corrente relazionato con ds padre $('ds1').p.DSsavetype // modalità di salvataggio row, table, live $('ds1').p.typeObj // tipo di oggetto ds < ds1 typeobj=&quot;ds&quot; ..... />
  • 17.
  • 18. LA FORMATTAZIONE DEI DATI Tecnica con la quale un dato “grezzo” può essere presentato in maniera diversa fornendo sempre la stessa informazione 20100522 22/05/2010 05-22-2010 22 Maggio 2010 5-22-10
  • 19.
  • 20. FORMATTAZIONE DATE E ORA Sintassi: date |lingua|formato|lingua|formato < text typeobj=”text” format=” date |EN|yyyy-mm-dd|IT|dd/mm/yyyy” /> Formato input Formato ouput Dato originale Format Output 20100522 EN|yyyy|mm|dd|IT|dd/mm/yyyy 22/05/2010 20100522 EN|yyyy|mm|dd|IT|dd mmm yyyy 22 Maggio 2010 20100522 EN|yyyy|mm|dd|IT|mm-dd-yyyy 05-22-2010 20100522 EN|yyyy|mm|dd|IT|m-dd-yy 5-22-10
  • 21. FORMATTAZIONE NUMERI Sintassi: number |lingua|formato|lingua|formato < text typeobj=”text” format=” number |EN|,0.00|IT|.0,00” /> Formato input Formato ouput Lingua: EN separatore delle migliaia(,) delle decine(.) IT separatore delle migliaia(.) delle decine(,) Dato originale Format Output 10,012.345.67890 EN|,00000|IT|0 10012346 10,012.345.67890 EN|,00000|IT|0,0 10012345,6 10,012.345.67890 EN|,00000|IT|0,00 10012345,67 10,012.345.67890 EN|,00000|IT|.0,000000 10.012.345,678900
  • 22. FORMATTAZIONE STRINGHE Sintassi: string |[lower][upper][trim][!][@@@@] < text typeobj=”text” format=” string |upper” /> Formato ouput Lingua: lower: trasforma tutti i caratteri in minuscolo upper: trasforma tutti i caratteri in maiuscolo trim: elimina gli spazi alla sinistra e destra della stringa @: se lunghezza stringa < aggiunge degli spazi alla sua destra !: da usare con @ se lunghezza stringa < aggiunge degli spazi alla sua sinistra Dato originale Format Output Jamp string|lower jamp Jamp string|upper JAMP
  • 23. INPUT CONTROLLATO JAMP prevede la validazione dei dati inseriti dagli utenti. VALIDAZIONE DIGIT VALIDAZIONE STRINGA VALIDAZIONE DATASOURCE
  • 24. VALIDAZIONE SINGOLO DIGIT L'espressione regolare va specificata nell'attributo keypress. number // Solo caratteri numerici nonumber // Escluso caratteri numerici alphanumeric // Solo caratteri alphanumerici noalphanumeric // Escluso caratteri alphanumerici alphabetic // Solo caratteri alfabetici loweralphabetic // Solo caratteri alfabetici minuscoli upperalphabetic // Solo caratteri alfabetici maiuscoli decimal // Solo caratteri decimali permission // Numerico da 0-7 < id typeobj=&quot;text&quot; maxlength=” 10 ” /> < id typeobj=&quot;text&quot; keypress=&quot; [a-dA-P] &quot; /> Espressioni regolari predefinite: < id typeobj=&quot;text&quot; keypress=&quot; number &quot; /> Lunghezza massima:
  • 25. VALIDAZIONE STRINGA Attributo da utilizzare blur nel quale specificare l'espressione regolare. number // Solo caratteri numerici decimal // Solo caratteri decimali ip // Indirizzo IP email // Indirizzo e-mail cf // Codice fiscale piva // P.Iva permission // Permission < id typeobj=&quot;text&quot; blur=&quot; email &quot; /> < id typeobj=&quot;text&quot; blur=&quot; ^[0-6]$ &quot; /> Espressioni regolari predefinite: < id typeobj=&quot;text&quot; minlength=” 3 ” /> Lunghezza minima:
  • 26. VALIDAZIONE DATASOURCE $DS_VALIDATE_RULE [&quot; idds &quot;]= &quot; Codice JS &quot;; <?php $DS_VALIDATE_RULE [&quot;ds3&quot;]= &quot; var dsObj = $('ds3'); var items = dsObj.DSresult[dsObj.DSpos]; if (items['votanti'] > 100) { alert('ATTENZIONE! Numero di voti non validi '); return false; } return true;”; ?>
  • 27.
  • 28. STRUTTURA DEI TEMPLATE Definito nella costante TEMPLATE Framework Page object < idob typeobj=” typeobj ” template=” template ” /> <page typeobj=” page ” template=” template ” /> Livello applicazione: < idob typeobj=” xmlpage ” src=” mypage.php ” /> <page typeobj=” page ” template=” template ” />
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.

Notas do Editor

  1. Non tutti gli errori sono visualizzabili
  2. Non tutti gli errori sono visualizzabili
  3. Non tutti gli errori sono visualizzabili
  4. Non tutti gli errori sono visualizzabili
  5. Non tutti gli errori sono visualizzabili
  6. Non tutti gli errori sono visualizzabili
  7. Non tutti gli errori sono visualizzabili
  8. Non tutti gli errori sono visualizzabili
  9. Non tutti gli errori sono visualizzabili
  10. Non tutti gli errori sono visualizzabili
  11. Non tutti gli errori sono visualizzabili
  12. Non tutti gli errori sono visualizzabili
  13. Non tutti gli errori sono visualizzabili