Esempio Online Anteprima
Descrizione: Utilizzo oggetto image
Sorgente PHP: examples/image/image.php
Sorgente XML: examples/image/image.xml
L'oggetto image è simile al tag html input type=image con in più la possibilità di:
- Legare il controllo ad un datasource tramite gli attributi dsobj e dsitem
- Effettuare upload delle immagini
<idtag typeobj="image" />
VISUALIZZARE IMMAGINE
Specificare il percorso da sorgente XML:
<idtag typeobj="image" src="percorso"/>
In alternatica image può essere popolata da un ds, gli attributi in gioco sono:
- dsobj: attributo contenete il nome del ds da cui prelevare i dati
- dsitem: attributo contenete il nome del campo dal quale leggere il percorso
<idtag typeobj="image" dsobj="dsname" dsitem="campo" />
UPLOAD IMMAGINI
Se non diversamente specificato l'opzione per upload delle immagini è già attiva, posizionando il mouse sopra l'immagine e cliccando sul apposito pannello a comparsa simbolo (+), si aprirà la classica finestra per la selezione dei files con la quale sarà possibile scegliere l'immagine da uplodare.
Per disabilitare upload si può utilizzare l'attributo readonly o disabilitare qualsiasi upload agendo sull'apposita costante
Quando un file viene uplodato sul server la sua directory di destinazione è la stessa della pagina che lo ha richiamato, è comunque possibile specificare un'altro percorso utilizzando l'attributo directory, la copia dei files può avvenire solo all'interno della "DocumentRoot"(percorso definito nel file httpd.conf del server WEB Apache) il valore da assegnare all'attributo directory deve essere relativo ad esso esempio:
DocumentRoot: /var/www
Destinazione: /var/www/jamp/frm/myproject/img
<idtag typeobj="image" directory="jamp/frm/img" />
Stesso discorso su piattaforma Windows
DocumentRoot: C:/Programmi/Apache Software Foundation/Apache2.2/htdocs
Destinazione: C:/Programmi/Apache Software Foundation/Apache2.2/htdocs/jamp/frm/myproject/img
<idtag typeobj="image" directory="jamp/frm/img" />
Problemi nell'upload dei files
1. Tutti gli upload verso il server web possono essere disabilitati tramite costante, per maggiori informazioni vedi costanti.
2. La directory di destinazione specificata non esiste/errata o comunque il servizio web non ha i permessi per scrivere al suo interno.
3. La presenza dell'iframe serve ad evitare il ricaricamento della pagina dopo l'upload, in fase di debug può essere utile commentare momentaneamente l'oggetto e verificare meglio la tipologia dell'errore.
<?php
/**
* PHP Source File
* @author Alyx Association <info@alyx.it>
* @version 1.0
* @copyright Alyx Association 2008-2010
* @license GNU Public License
*/
require_once("./../../class/system.class.php");
$system = new ClsSystem(true);
$xml = new ClsXML("image.xml");
$event = new ClsEvent($xml);
$event->managerRequest();
?>
<?xml version="1.0" encoding="utf-8"?>
<jamp>
<page typeobj="page" title="JAMP - Esempio image" loaddata="true" icon="../../favicon.ico" out="html">
<ds1 typeobj="ds" conn="conn12" scope="onelevel" dskey="key" base="/jamp/data" />
<image1 typeobj="image" dsobj="ds1" dsitem="logo" border="1" label="IMG 16x16:" labelwidth="150px" />
<image2 typeobj="image" dsobj="ds1" dsitem="logo" border="1" label="IMG 32x32:" labelwidth="150px" width="32px" height="32px"/>
<image3 typeobj="image" dsobj="ds1" dsitem="logo" border="1" label="IMG 64x64:" labelwidth="150px" width="64px" height="64px"/>
<image4 typeobj="image" dsobj="ds1" dsitem="logo" border="1" label="IMG 128x128:" labelwidth="150px" width="128px" height="128px"/>
<image5 typeobj="image" dsobj="ds1" dsitem="logo" border="1" label="IMG 100x150:" labelwidth="150px" width="100px" height="150px"/>
</page>
</jamp>
›› REFERENCE XML - IMAGE
Oggetto: IMAGE
<nome typeobj="image" attribute="valore".../>
Attributi:
debug
Attiva il debug dell'oggetto.
Valori consentiti: true,false
Valori di default: false
onclick
Codice associato all'evento onclick.
ondblclick
Codice associato all'evento ondblclick.
onmousedown
Codice associato all'evento onmousedown.
onmouseup
Codice associato all'evento onmouseup.
onmouseover
Codice associato all'evento onmouseover.
onmousemove
Codice associato all'evento onmousemove.
onmouseout
Codice associato all'evento onmouseout.
onkeypress
Codice associato all'evento onkeypress.
onkeydown
Codice associato all'evento onkeydown.
onkeyup
Codice associato all'evento onkeyup.
class
Nome della classe di stile utilizzata dall'oggetto.
Valori di default: image
style
Proprietà di stile.
lang
Specifica il codice della lingua utilizzata.
dir
Direzione del testo:
- LTR da sinistra a destra(default).
- RTL da destra a sinistra.
template
Nome del template utilizzato dall'oggetto, se non specificato viene utilizzato quello di sistema.
title
Informazioni aggiuntive visualizzate al passaggio del mouse sull'oggetto istanziato.
readonly
Oggetto in sola lettura.
Valori consentiti: true,false
Valori di default: false
mouseup
Codice associato all'evento mouseup.
id
Nome univoco dell'oggetto.
Valori di default: image
maxsize
Dimensione massima di upload.
alt
Testo alternativo.
height
Altezza dell'oggetto (con unità di misura es: 600px).
Valori di default: 16
src
URL immagine.
hspace
Margine orizzontale
ismap
Specifica se l'oggetto è una mappa.
Valori consentiti: true,false
longdesc
Descrizione.
usemap
Mappa dell'oggetto.
vspace
Margine verticale.
width
Larghezza dell'oggetto (con unità di misura es: 600px).
Valori di default: 16
accesskey
Assegna un tasto per accedere all'oggetto.
onfocus
Codice associato all'evento onfocus.
onselect
Codice associato all'evento onselect.
onblur
Codice associato all'evento onblur.
onchange
Codice associato all'evento onchange.
tabindex
Indice di tabulazione.
value
Vedi TAG VALUE
Valore dell'oggetto.
directory
Path delle immagini.
Valori di default: /jamp/doc/
extension
Estensioni accettate.
Valori di default: image
border
Dimensione del bordo.
Valori di default: 1
label
Etichetta dell'oggetto.
labelalign
Allineamento etichetta rispetto all'oggetto
Valori consentiti: left,right
Valori di default: left
labelwidth
Larghezza dell'etichetta.
labelstyle
Stile associato all'etichetta.
java
Nome del/dei file javascript usati dall'oggetto.
Valori di default: image.js
cssfile
Nome del file css usato dall'oggetto.
Valori di default: objcss/default/image.css
dsobj
ID dell'oggetto datasource associato.
dsitem
Nome del campo datasource associato.
display
ID dell'oggetto che visualizza/nasconde l'immagine.
Es. "display"="tabs1"
L'init dell'immagine avverà solamente alla chiamata della funzione tabs1Display().
Per un corretto funzionamento dell'immagine l'inizializzazione deve avvenire quando la griglia non è nascosta dal css. Non è necessario impostare questo valore poichè viene ereditato automaticamente in base all'oggetto in cui si trova l'immagine.
size
Dimensione dell'oggetto.
›› Elenco dei metodi Javascript intercettabili dall'utente:
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","moveRow", "User function"); Function parameters: function(obj)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","AfterPost", "User function"); Function parameters: function(ris,mes)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","setDsValue", "User function"); Function parameters: function(id,inputFile)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","displayObj", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","getDsValue", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","refreshObj", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","showAdd", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","hideAdd", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","cancel", "User function"); Function parameters: function(id,event)
Sintassi JS: SYSTEMEVENT.addBeforeCustomFunction("IMAGE","browser", "User function"); Function parameters: function(obj,event)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","moveRow", "User function"); Function parameters: function(obj)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","AfterPost", "User function"); Function parameters: function(ris,mes)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","setDsValue", "User function"); Function parameters: function(id,inputFile)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","displayObj", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","getDsValue", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","refreshObj", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","showAdd", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","hideAdd", "User function"); Function parameters: function(id)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","cancel", "User function"); Function parameters: function(id,event)
Sintassi JS: SYSTEMEVENT.addAfterCustomFunction("IMAGE","browser", "User function"); Function parameters: function(obj,event)
›› Note fornite dagli utenti