Scripts | Web Developer Freelance / Web Designer / SEO Specialist Freelance

JavaScript estensione file: rilevare l’estensione di un file in JS

Pubblicato il 13/2/2012 alle 07:06

emawebdesign

Spesso, in una web application, abbiamo la necessità di effettuare dei controlli sul tipo di file che viene selezionato in un campo di tipo input file.

Possiamo rilevare l’estensione del file con la seguente funzione JavaScript:

function getFileExtension(filename)
{
  var ext = /^.+\.([^.]+)$/.exec(filename);
  return ext == null ? "" : ext[1];
}

Avendo il campo input file, l’id univoco “myFile“, utilizzeremo la funzione per verificare se, l’estensione, è di tipo jpg, gif o png:

var file = $('#myFile').val();
 
var fileExt = getFileExtension(file);
 
if (fileExt!="" && fileExt!="jpg" && fileExt!="gif" && fileExt!="png")  {
 
            alert("Il file deve essere di tipo JPG, GIF o PNG!");
 
}

Pubblicato in: JavaScript, jQuery, Scripts, tips | Nessun commento »

Invia questo articolo a un amico via email

Combobox regione e provincia referenziate tramite JavaScript

Pubblicato il 30/1/2012 alle 07:29

emawebdesign

Nell’articolo ComboBox pronte all’uso: select nazioni, regioni e province ho condiviso l’HTML delle combobox di nazione, regione e provincia per offrirti un comodo copia-incolla.

Oggi condivido l’HTML e una funzione JavaScript che ti permetterà di implementare le combo regione e provincia “referenziate“. In pratica, selezionando una regione nella prima combobox, verranno poi caricate le rispettive province nella seconda.

Combo regioni

<select id="regione" name="regione" onchange="javascript:loadProvincia(this.value);">
<option value="" selected>Seleziona</option>
<option value="abruzzo">abruzzo</option>
<option value="basilicata">basilicata</option>
<option value="calabria">calabria</option>
<option value="campania">campania</option>
<option value="emilia romagna">emilia romagna</option>
<option value="friuli venezia giulia">friuli venezia giulia</option>
<option value="lazio">lazio</option>
<option value="liguria">liguria</option>
<option value="lombardia">lombardia</option>
<option value="marche">marche</option>
<option value="molise">molise</option>
<option value="piemonte">piemonte</option>
<option value="puglia">puglia</option>
<option value="sardegna">sardegna</option>
<option value="sicilia">sicilia</option>
<option value="toscana">toscana</option>
<option value="trentino alto adige">trentino alto adige</option>
<option value="umbria">umbria</option>
<option value="valle d'aosta">valle d'aosta</option>
<option value="veneto">veneto</option>
</select>

Combo province

<select id="provincia" name="provincia">
<option value="" selected>Seleziona</option>
 </select>

Combo regioni (edit version)

<select id="regione" name="regione" onchange="javascript:loadProvincia(this.value);">
<option value="" <?php if ($regione=="") echo "selected"; ?> >Seleziona</option>
<option value="abruzzo" <?php if ($regione=="abruzzo") echo "selected"; ?> >abruzzo</option>
<option value="basilicata" <?php if ($regione=="basilicata") echo "selected"; ?> >basilicata</option>
<option value="calabria" <?php if ($regione=="calabria") echo "selected"; ?> >calabria</option>
<option value="campania" <?php if ($regione=="campania") echo "selected"; ?> >campania</option>
<option value="emilia romagna" <?php if ($regione=="emilia romagna") echo "selected"; ?> >emilia romagna</option>
<option value="friuli venezia giulia" <?php if ($regione=="friuli venezia giulia") echo "selected"; ?> >friuli venezia giulia</option>
<option value="lazio" <?php if ($regione=="lazio") echo "selected"; ?> >lazio</option>
<option value="liguria" <?php if ($regione=="liguria") echo "selected"; ?> >liguria</option>
<option value="lombardia" <?php if ($regione=="lombardia") echo "selected"; ?> >lombardia</option>
<option value="marche" <?php if ($regione=="marche") echo "selected"; ?> >marche</option>
<option value="molise" <?php if ($regione=="molise") echo "selected"; ?> >molise</option>
<option value="piemonte" <?php if ($regione=="piemonte") echo "selected"; ?> >piemonte</option>
<option value="puglia" <?php if ($regione=="puglia") echo "selected"; ?> >puglia</option>
<option value="sardegna" <?php if ($regione=="sardegna") echo "selected"; ?> >sardegna</option>
<option value="sicilia" <?php if ($regione=="sicilia") echo "selected"; ?> >sicilia</option>
<option value="toscana" <?php if ($regione=="toscana") echo "selected"; ?> >toscana</option>
<option value="trentino alto adige" <?php if ($regione=="trentino alto adige") echo "selected"; ?> >trentino alto adige</option>
<option value="umbria" <?php if ($regione=="umbria") echo "selected"; ?> >umbria</option>
<option value="valle d'aosta" <?php if ($regione=="valle d'aosta") echo "selected"; ?> >valle d'aosta</option>
<option value="veneto" <?php if ($regione=="veneto") echo "selected"; ?> >veneto</option>
</select>

Combo province (edit version)

<select id="provincia" name="provincia">
<option value="" <?php if ($provincia=="") echo "selected"; ?> >Seleziona</option>
<option value="Agrigento" <?php if ($provincia=="Agrigento") echo "selected"; ?> >Agrigento</option>
<option value="Alessandria" <?php if ($provincia=="Alessandria") echo "selected"; ?> >Alessandria</option>
<option value="Ancona" <?php if ($provincia=="Ancona") echo "selected"; ?> >Ancona</option>
<option value="Aosta" <?php if ($provincia=="Aosta") echo "selected"; ?> >Aosta</option>
<option value="Arezzo" <?php if ($provincia=="Arezzo") echo "selected"; ?> >Arezzo</option>
<option value="Ascoli Piceno" <?php if ($provincia=="Ascoli Piceno") echo "selected"; ?> >Ascoli Piceno</option>
<option value="Asti" <?php if ($provincia=="Asti") echo "selected"; ?> >Asti</option>
<option value="Avellino" <?php if ($provincia=="Avellino") echo "selected"; ?> >Avellino</option>
<option value="Bari" <?php if ($provincia=="Bari") echo "selected"; ?> >Bari</option>
<option value="Barletta-Andria-Trani" <?php if ($provincia=="Barletta-Andria-Trani") echo "selected"; ?> >Barletta-Andria-Trani</option>
<option value="Belluno" <?php if ($provincia=="Belluno") echo "selected"; ?> >Belluno</option>
<option value="Benevento" <?php if ($provincia=="Benevento") echo "selected"; ?> >Benevento</option>
<option value="Bergamo" <?php if ($provincia=="Bergamo") echo "selected"; ?> >Bergamo</option>
<option value="Biella" <?php if ($provincia=="Biella") echo "selected"; ?> >Biella</option>
<option value="Bologna" <?php if ($provincia=="Bologna") echo "selected"; ?> >Bologna</option>
<option value="Bolzano" <?php if ($provincia=="Bolzano") echo "selected"; ?> >Bolzano</option>
<option value="Brescia" <?php if ($provincia=="Brescia") echo "selected"; ?> >Brescia</option>
<option value="Brindisi" <?php if ($provincia=="Brindisi") echo "selected"; ?> >Brindisi</option>
<option value="Cagliari" <?php if ($provincia=="Cagliari") echo "selected"; ?> >Cagliari</option>
<option value="Caltanissetta" <?php if ($provincia=="Caltanissetta") echo "selected"; ?> >Caltanissetta</option>
<option value="Caserta" <?php if ($provincia=="Caserta") echo "selected"; ?> >Caserta</option>
<option value="Catania" <?php if ($provincia=="Catania") echo "selected"; ?> >Catania</option>
<option value="Catanzaro" <?php if ($provincia=="Catanzaro") echo "selected"; ?> >Catanzaro</option>
<option value="Chieti" <?php if ($provincia=="Chieti") echo "selected"; ?> >Chieti</option>
<option value="Como" <?php if ($provincia=="Como") echo "selected"; ?> >Como</option>
<option value="Cosenza" <?php if ($provincia=="Cosenza") echo "selected"; ?> >Cosenza</option>
<option value="Cremona" <?php if ($provincia=="Cremona") echo "selected"; ?> >Cremona</option>
<option value="Crotone" <?php if ($provincia=="Crotone") echo "selected"; ?> >Crotone</option>
<option value="Cuneo" <?php if ($provincia=="Cuneo") echo "selected"; ?> >Cuneo</option>
<option value="Enna" <?php if ($provincia=="Enna") echo "selected"; ?> >Enna</option>
<option value="Ferrara" <?php if ($provincia=="Ferrara") echo "selected"; ?> >Ferrara</option>
<option value="Firenze" <?php if ($provincia=="Firenze") echo "selected"; ?> >Firenze</option>
<option value="Foggia" <?php if ($provincia=="Foggia") echo "selected"; ?> >Foggia</option>
<option value="Forl&igrave;-Cesena" <?php if ($provincia=="Forl&igrave;-Cesena") echo "selected"; ?> >Forl&igrave;-Cesena</option>
<option value="Frosinone" <?php if ($provincia=="Frosinone") echo "selected"; ?> >Frosinone</option>
<option value="Genova" <?php if ($provincia=="Genova") echo "selected"; ?> >Genova</option>
<option value="Gorizia" <?php if ($provincia=="Gorizia") echo "selected"; ?> >Gorizia</option>
<option value="Grosseto" <?php if ($provincia=="Grosseto") echo "selected"; ?> >Grosseto</option>
<option value="Imperia" <?php if ($provincia=="Imperia") echo "selected"; ?> >Imperia</option>
<option value="L\'Aquila" <?php if ($provincia=="L\'Aquila") echo "selected"; ?> >L\'Aquila</option>
<option value="La Spezia" <?php if ($provincia=="La Spezia") echo "selected"; ?> >La Spezia</option>
<option value="Latina" <?php if ($provincia=="Latina") echo "selected"; ?> >Latina</option>
<option value="Lecce" <?php if ($provincia=="Lecce") echo "selected"; ?> >Lecce</option>
<option value="Lecco" <?php if ($provincia=="Lecco") echo "selected"; ?> >Lecco</option>
<option value="Livorno" <?php if ($provincia=="Livorno") echo "selected"; ?> >Livorno</option>
<option value="Lodi" <?php if ($provincia=="Lodi") echo "selected"; ?> >Lodi</option>
<option value="Lucca" <?php if ($provincia=="Lucca") echo "selected"; ?> >Lucca</option>
<option value="Macerata" <?php if ($provincia=="Macerata") echo "selected"; ?> >Macerata</option>
<option value="Mantova" <?php if ($provincia=="Mantova") echo "selected"; ?> >Mantova</option>
<option value="Massa Carrara" <?php if ($provincia=="Massa Carrara") echo "selected"; ?> >Massa Carrara</option>
<option value="Matera" <?php if ($provincia=="Matera") echo "selected"; ?> >Matera</option>
<option value="Messina" <?php if ($provincia=="Messina") echo "selected"; ?> >Messina</option>
<option value="Milano" <?php if ($provincia=="Milano") echo "selected"; ?> >Milano</option>
<option value="Modena" <?php if ($provincia=="Modena") echo "selected"; ?> >Modena</option>
<option value="Monza Brianza" <?php if ($provincia=="Monza Brianza") echo "selected"; ?> >Monza Brianza</option>
<option value="Napoli" <?php if ($provincia=="Napoli") echo "selected"; ?> >Napoli</option>
<option value="Novara" <?php if ($provincia=="Novara") echo "selected"; ?> >Novara</option>
<option value="Nuoro" <?php if ($provincia=="Nuoro") echo "selected"; ?> >Nuoro</option>
<option value="Olbia-Tempio" <?php if ($provincia=="Olbia-Tempio") echo "selected"; ?> >Olbia-Tempio</option>
<option value="Oristano" <?php if ($provincia=="Oristano") echo "selected"; ?> >Oristano</option>
<option value="Padova" <?php if ($provincia=="Padova") echo "selected"; ?> >Padova</option>
<option value="Palermo" <?php if ($provincia=="Palermo") echo "selected"; ?> >Palermo</option>
<option value="Parma" <?php if ($provincia=="Parma") echo "selected"; ?> >Parma</option>
<option value="Pavia" <?php if ($provincia=="Pavia") echo "selected"; ?> >Pavia</option>
<option value="Perugia" <?php if ($provincia=="Perugia") echo "selected"; ?> >Perugia</option>
<option value="Pesaro e Urbino" <?php if ($provincia=="Pesaro e Urbino") echo "selected"; ?> >Pesaro e Urbino</option>
<option value="Pescara" <?php if ($provincia=="Pescara") echo "selected"; ?> >Pescara</option>
<option value="Piacenza" <?php if ($provincia=="Piacenza") echo "selected"; ?> >Piacenza</option>
<option value="Pisa" <?php if ($provincia=="Pisa") echo "selected"; ?> >Pisa</option>
<option value="Pistoia" <?php if ($provincia=="Pistoia") echo "selected"; ?> >Pistoia</option>
<option value="Pordenone" <?php if ($provincia=="Pordenone") echo "selected"; ?> >Pordenone</option>
<option value="Potenza" <?php if ($provincia=="Potenza") echo "selected"; ?> >Potenza</option>
<option value="Prato" <?php if ($provincia=="Prato") echo "selected"; ?> >Prato</option>
<option value="Ragusa" <?php if ($provincia=="Ragusa") echo "selected"; ?> >Ragusa</option>
<option value="Ravenna" <?php if ($provincia=="Ravenna") echo "selected"; ?> >Ravenna</option>
<option value="Reggio Calabria" <?php if ($provincia=="Reggio Calabria") echo "selected"; ?> >Reggio Calabria</option>
<option value="Repubblica di San Marino" <?php if ($provincia=="Repubblica di San Marino") echo "selected"; ?> >Repubblica di San Marino</option>
<option value="Rieti" <?php if ($provincia=="Rieti") echo "selected"; ?> >Rieti</option>
<option value="Rimini" <?php if ($provincia=="Rimini") echo "selected"; ?> >Rimini</option>
<option value="Roma" <?php if ($provincia=="Roma") echo "selected"; ?> >Roma</option>
<option value="Rovigo" <?php if ($provincia=="Rovigo") echo "selected"; ?> >Rovigo</option>
<option value="Salerno" <?php if ($provincia=="Salerno") echo "selected"; ?> >Salerno</option>
<option value="Sassari" <?php if ($provincia=="Sassari") echo "selected"; ?> >Sassari</option>
<option value="Savona" <?php if ($provincia=="Savona") echo "selected"; ?> >Savona</option>
<option value="Siena" <?php if ($provincia=="Siena") echo "selected"; ?> >Siena</option>
<option value="Siracusa" <?php if ($provincia=="Siracusa") echo "selected"; ?> >Siracusa</option>
<option value="Sondrio" <?php if ($provincia=="Sondrio") echo "selected"; ?> >Sondrio</option>
<option value="Taranto" <?php if ($provincia=="Taranto") echo "selected"; ?> >Taranto</option>
<option value="Teramo" <?php if ($provincia=="Teramo") echo "selected"; ?> >Teramo</option>
<option value="Terni" <?php if ($provincia=="Terni") echo "selected"; ?> >Terni</option>
<option value="Torino" <?php if ($provincia=="Torino") echo "selected"; ?> >Torino</option>
<option value="Trapani" <?php if ($provincia=="Trapani") echo "selected"; ?> >Trapani</option>
<option value="Trento" <?php if ($provincia=="Trento") echo "selected"; ?> >Trento</option>
<option value="Treviso" <?php if ($provincia=="Treviso") echo "selected"; ?> >Treviso</option>
<option value="Trieste" <?php if ($provincia=="Trieste") echo "selected"; ?> >Trieste</option>
<option value="Udine" <?php if ($provincia=="Udine") echo "selected"; ?> >Udine</option>
<option value="Varese" <?php if ($provincia=="Varese") echo "selected"; ?> >Varese</option>
<option value="Venezia" <?php if ($provincia=="Venezia") echo "selected"; ?> >Venezia</option>
<option value="Verb-Cus-Ossola" <?php if ($provincia=="Verb-Cus-Ossola") echo "selected"; ?> >Verb-Cus-Ossola</option>
<option value="Vercelli" <?php if ($provincia=="Vercelli") echo "selected"; ?> >Vercelli</option>
<option value="Verona" <?php if ($provincia=="Verona") echo "selected"; ?> >Verona</option>
<option value="Vibo Valentia" <?php if ($provincia=="Vibo Valentia") echo "selected"; ?> >Vibo Valentia</option>
<option value="Vicenza" <?php if ($provincia=="Vicenza") echo "selected"; ?> >Vicenza</option>
<option value="Viterbo" <?php if ($provincia=="Viterbo") echo "selected"; ?> >Viterbo</option>           
</select>

Ed ecco la funzione JavaScript

function loadProvincia(param) {
 
var str = "";
 
    if (param=="") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Agrigento">Agrigento</option>';
        str += '<option value="Alessandria">Alessandria</option>';
        str += '<option value="Ancona">Ancona</option>';
        str += '<option value="Aosta">Aosta</option>';
        str += '<option value="Arezzo">Arezzo</option>';
        str += '<option value="Ascoli Piceno">Ascoli Piceno</option>';
        str += '<option value="Asti">Asti</option>';
        str += '<option value="Avellino">Avellino</option>';
        str += '<option value="Bari">Bari</option>';
        str += '<option value="Barletta-Andria-Trani">Barletta-Andria-Trani</option>';
        str += '<option value="Belluno">Belluno</option>';
        str += '<option value="Benevento">Benevento</option>';
        str += '<option value="Bergamo">Bergamo</option>';
        str += '<option value="Biella">Biella</option>';
        str += '<option value="Bologna">Bologna</option>';
        str += '<option value="Bolzano">Bolzano</option>';
        str += '<option value="Brescia">Brescia</option>';
        str += '<option value="Brindisi">Brindisi</option>';
        str += '<option value="Cagliari">Cagliari</option>';
        str += '<option value="Caltanissetta">Caltanissetta</option>';
        str += '<option value="Caserta">Caserta</option>';
        str += '<option value="Catania">Catania</option>';
        str += '<option value="Catanzaro">Catanzaro</option>';
        str += '<option value="Chieti">Chieti</option>';
        str += '<option value="Como">Como</option>';
        str += '<option value="Cosenza">Cosenza</option>';
        str += '<option value="Cremona">Cremona</option>';
        str += '<option value="Crotone">Crotone</option>';
        str += '<option value="Cuneo">Cuneo</option>';
        str += '<option value="Enna">Enna</option>';
        str += '<option value="Ferrara">Ferrara</option>';
        str += '<option value="Firenze">Firenze</option>';
        str += '<option value="Foggia">Foggia</option>';
        str += '<option value="Forl&igrave;-Cesena">Forl&igrave;-Cesena</option>';
        str += '<option value="Frosinone">Frosinone</option>';
        str += '<option value="Genova">Genova</option>';
        str += '<option value="Gorizia">Gorizia</option>';
        str += '<option value="Grosseto">Grosseto</option>';
        str += '<option value="Imperia">Imperia</option>';
        str += '<option value="L\'Aquila">L\'Aquila</option>';
        str += '<option value="La Spezia">La Spezia</option>';
        str += '<option value="Latina">Latina</option>';
        str += '<option value="Lecce">Lecce</option>';
        str += '<option value="Lecco">Lecco</option>';
        str += '<option value="Livorno">Livorno</option>';
        str += '<option value="Lodi">Lodi</option>';
        str += '<option value="Lucca">Lucca</option>';
        str += '<option value="Macerata">Macerata</option>';
        str += '<option value="Mantova">Mantova</option>';
        str += '<option value="Massa Carrara">Massa Carrara</option>';
        str += '<option value="Matera">Matera</option>';
        str += '<option value="Messina">Messina</option>';
        str += '<option value="Milano">Milano</option>';
        str += '<option value="Modena">Modena</option>';
        str += '<option value="Monza Brianza">Monza Brianza</option>';
        str += '<option value="Napoli">Napoli</option>';
        str += '<option value="Novara">Novara</option>';
        str += '<option value="Nuoro">Nuoro</option>';
        str += '<option value="Olbia-Tempio">Olbia-Tempio</option>';
        str += '<option value="Oristano">Oristano</option>';
        str += '<option value="Padova">Padova</option>';
        str += '<option value="Palermo">Palermo</option>';
        str += '<option value="Parma">Parma</option>';
        str += '<option value="Pavia">Pavia</option>';
        str += '<option value="Perugia">Perugia</option>';
        str += '<option value="Pesaro e Urbino">Pesaro e Urbino</option>';
        str += '<option value="Pescara">Pescara</option>';
        str += '<option value="Piacenza">Piacenza</option>';
        str += '<option value="Pisa">Pisa</option>';
        str += '<option value="Pistoia">Pistoia</option>';
        str += '<option value="Pordenone">Pordenone</option>';
        str += '<option value="Potenza">Potenza</option>';
        str += '<option value="Prato">Prato</option>';
        str += '<option value="Ragusa">Ragusa</option>';
        str += '<option value="Ravenna">Ravenna</option>';
        str += '<option value="Reggio Calabria">Reggio Calabria</option>';
        str += '<option value="Repubblica di San Marino">Repubblica di San Marino</option>';
        str += '<option value="Rieti">Rieti</option>';
        str += '<option value="Rimini">Rimini</option>';
        str += '<option value="Roma">Roma</option>';
        str += '<option value="Rovigo">Rovigo</option>';
        str += '<option value="Salerno">Salerno</option>';
        str += '<option value="Sassari">Sassari</option>';
        str += '<option value="Savona">Savona</option>';
        str += '<option value="Siena">Siena</option>';
        str += '<option value="Siracusa">Siracusa</option>';
        str += '<option value="Sondrio">Sondrio</option>';
        str += '<option value="Taranto">Taranto</option>';
        str += '<option value="Teramo">Teramo</option>';
        str += '<option value="Terni">Terni</option>';
        str += '<option value="Torino">Torino</option>';
        str += '<option value="Trapani">Trapani</option>';
        str += '<option value="Trento">Trento</option>';
        str += '<option value="Treviso">Treviso</option>';
        str += '<option value="Trieste">Trieste</option>';
        str += '<option value="Udine">Udine</option>';
        str += '<option value="Varese">Varese</option>';
        str += '<option value="Venezia">Venezia</option>';
        str += '<option value="Verb-Cus-Ossola">Verb-Cus-Ossola</option>';
        str += '<option value="Vercelli">Vercelli</option>';
        str += '<option value="Verona">Verona</option>';
        str += '<option value="Vibo Valentia">Vibo Valentia</option>';
        str += '<option value="Vicenza">Vicenza</option>';
        str += '<option value="Viterbo">Viterbo</option>';
 
    }
 
 
    if (param=="abruzzo") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Chieti">Chieti</option>';
        str += '<option value="L\'Aquila">L\'Aquila</option>';
        str += '<option value="Pescara">Pescara</option>';
        str += '<option value="Teramo">Teramo</option>';
 
    }
 
 
 
    if (param=="basilicata") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Matera">Matera</option>';
        str += '<option value="Potenza">Potenza</option>';
 
    }
 
 
 
    if (param=="calabria") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Catanzaro">Catanzaro</option>';
        str += '<option value="Cosenza">Cosenza</option>';
        str += '<option value="Crotone">Crotone</option>';
        str += '<option value="Reggio Calabria">Reggio Calabria</option>';
        str += '<option value="Vibo Valentia">Vibo Valentia</option>';
 
    }
 
 
 
 
    if (param=="campania") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Avellino">Avellino</option>';
        str += '<option value="Benevento">Benevento</option>';
        str += '<option value="Caserta">Caserta</option>';
        str += '<option value="Napoli">Napoli</option>';
        str += '<option value="Salerno">Salerno</option>';
 
    }
 
 
 
 
    if (param=="emilia romagna") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Bologna">Bologna</option>';
        str += '<option value="Ferrara">Ferrara</option>';
        str += '<option value="Forl&igrave;-Cesena">Forl&igrave;-Cesena</option>';
        str += '<option value="Modena">Modena</option>';
        str += '<option value="Parma">Parma</option>';
        str += '<option value="Piacenza">Piacenza</option>';
        str += '<option value="Ravenna">Ravenna</option>';
        str += '<option value="Repubblica di San Marino">Repubblica di San Marino</option>';
        str += '<option value="Rimini">Rimini</option>';
 
    }
 
 
 
 
    if (param=="friuli venezia giulia") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Gorizia">Gorizia</option>';
        str += '<option value="Pordenone">Pordenone</option>';
        str += '<option value="Trieste">Trieste</option>';
        str += '<option value="Udine">Udine</option>';
 
    }
 
 
 
 
    if (param=="lazio") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Frosinone">Frosinone</option>';
        str += '<option value="Latina">Latina</option>';
        str += '<option value="Rieti">Rieti</option>';
        str += '<option value="Roma">Roma</option>';
        str += '<option value="Viterbo">Viterbo</option>';
 
    }
 
 
 
 
 
    if (param=="liguria") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Genova">Genova</option>';
        str += '<option value="Imperia">Imperia</option>';
        str += '<option value="La Spezia">La Spezia</option>';
        str += '<option value="Savona">Savona</option>';
 
    }
 
 
 
 
    if (param=="lombardia") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Bergamo">Bergamo</option>';
        str += '<option value="Brescia">Brescia</option>';
        str += '<option value="Como">Como</option>';
        str += '<option value="Cremona">Cremona</option>';
        str += '<option value="Lecco">Lecco</option>';
        str += '<option value="Lodi">Lodi</option>';
        str += '<option value="Mantova">Mantova</option>';
        str += '<option value="Milano">Milano</option>';
        str += '<option value="Monza Brianza">Monza Brianza</option>';
        str += '<option value="Pavia">Pavia</option>';
        str += '<option value="Sondrio">Sondrio</option>';
        str += '<option value="Varese">Varese</option>';
 
    }
 
 
 
 
    if (param=="marche") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Ancona">Ancona</option>';
        str += '<option value="Ascoli Piceno">Ascoli Piceno</option>';
        str += '<option value="Macerata">Macerata</option>';
        str += '<option value="Pesaro e Urbino">Pesaro e Urbino</option>';
 
    }
 
 
 
 
    if (param=="piemonte") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Alessandria">Alessandria</option>';
        str += '<option value="Asti">Asti</option>';
        str += '<option value="Biella">Biella</option>';
        str += '<option value="Cuneo">Cuneo</option>';
        str += '<option value="Novara">Novara</option>';
        str += '<option value="Torino">Torino</option>';
        str += '<option value="Verb-Cus-Ossola">Verb-Cus-Ossola</option>';
        str += '<option value="Vercelli">Vercelli</option>';
 
    }
 
 
 
 
    if (param=="puglia") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Bari">Bari</option>';
        str += '<option value="Barletta-Andria-Trani">Barletta-Andria-Trani</option>';
        str += '<option value="Brindisi">Brindisi</option>';
        str += '<option value="Foggia">Foggia</option>';
        str += '<option value="Lecce">Lecce</option>';
        str += '<option value="Taranto">Taranto</option>';
 
    }
 
 
 
 
 
    if (param=="sardegna") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Cagliari">Cagliari</option>';
        str += '<option value="Nuoro">Nuoro</option>';
        str += '<option value="Olbia-Tempio">Olbia-Tempio</option>';
        str += '<option value="Oristano">Oristano</option>';
        str += '<option value="Sassari">Sassari</option>';
 
    }
 
 
 
 
    if (param=="sicilia") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Agrigento">Agrigento</option>';
        str += '<option value="Caltanissetta">Caltanissetta</option>';
        str += '<option value="Catania">Catania</option>';
        str += '<option value="Enna">Enna</option>';
        str += '<option value="Messina">Messina</option>';
        str += '<option value="Palermo">Palermo</option>';
        str += '<option value="Ragusa">Ragusa</option>';
        str += '<option value="Siracusa">Siracusa</option>';
        str += '<option value="Trapani">Trapani</option>';
 
    }
 
 
 
 
    if (param=="toscana") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Arezzo">Arezzo</option>';
        str += '<option value="Firenze">Firenze</option>';
        str += '<option value="Grosseto">Grosseto</option>';
        str += '<option value="Livorno">Livorno</option>';
        str += '<option value="Lucca">Lucca</option>';
        str += '<option value="Massa Carrara">Massa Carrara</option>';
        str += '<option value="Pisa">Pisa</option>';
        str += '<option value="Pistoia">Pistoia</option>';
        str += '<option value="Prato">Prato</option>';
        str += '<option value="Siena">Siena</option>';
 
    }
 
 
 
 
    if (param=="trentino alto adige") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Bolzano">Bolzano</option>';
        str += '<option value="Trento">Trento</option>';
 
    }
 
 
 
 
    if (param=="umbria") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Perugia">Perugia</option>';
        str += '<option value="Terni">Terni</option>';
 
    }
 
 
 
    if (param=="valle d'aosta") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Aosta">Aosta</option>';
 
    }
 
 
 
 
    if (param=="veneto") {
 
        str += '<option value="" selected>Seleziona</option>';
        str += '<option value="Belluno">Belluno</option>';
        str += '<option value="Padova">Padova</option>';
        str += '<option value="Rovigo">Rovigo</option>';
        str += '<option value="Treviso">Treviso</option>';
        str += '<option value="Venezia">Venezia</option>';
        str += '<option value="Verona">Verona</option>';
        str += '<option value="Vicenza">Vicenza</option>';
 
    }
 
 
 
    $('#provincia').html(str);
 
}

Pubblicato in: HTML, JavaScript, Programmazione, Scripts | Nessun commento »

Invia questo articolo a un amico via email

Finestra confirm con SimpleModal

Pubblicato il 25/1/2012 alle 13:12

emawebdesign

Con l’articolo Simple Modal: finestre di dialogo personalizzate ti ho segnalato un ottimo plugin jQuery per implementare finestre modali, SimpleModal di Eric Martin.

Piccolo “tips“, se vuoi utilizzare la finestra “confirm” con questo plugin, la sintassi è la seguente:

confirm("Sicuro di voler eliminare l'immagine?", function () {
 
    //Operazioni da compiere se si conferma, in questo caso un redirect
    window.location.href = param;
 
});

Pubblicato in: JavaScript, jQuery, Open Source, Programmazione, Scripts, tips | Nessun commento »

Invia questo articolo a un amico via email

TwitteringJS – jQuery Plugin per pubblicare news sul proprio sito tramite Twitter

Pubblicato il 22/12/2011 alle 16:18

emawebdesign

Oggi voglio condividere con te un plugin per jQuery che ho realizzato per tutti coloro che vogliono pubblicare news sul proprio sito web, comodamente, utilizzando il proprio account Twitter.

Il plugin si chiama TwitteringJS e trovate qui tutti i dettagli per scaricarlo gratuitamente ed utilizzarlo

Pubblicato in: JavaScript, jQuery, News, Open Source, Risorse, Scripts, Web 2.0 | Nessun commento »

Invia questo articolo a un amico via email

Ecco perchè non amo i Template Engine

Pubblicato il 12/12/2011 alle 06:54

emawebdesign

Con questo articolo voglio spiegarti perchè non amo i Template Engine, perchè non li utilizzo e non li utilizzerò. Ma partiamo dall’inizio che sembra la cosa più giusta da fare

Cos’è un Template Engine e a cosa serve?

Un Template Engine è un insieme di librerie e/o codici che permette di separare il contenuto dalla presentazione in un applicazione web. Il Template Engine più famoso e utilizzato è probabilmente Smarty.

Separare il contenuto (codice, dati ecc.) dalla presentazione (layout, html, css) è sicuramente un approccio da adottare in quanto agevola il lavoro delle diverse figure professionali che collaborano per lo sviluppo di un’applicazione (il web developer e il web designer), che possono lavorare separatamente senza dover dipendere l’uno dall’altro. Come riporta l’articolo di php.html.it linkato all’inizio del post:

“il programmatore si preoccupa solamente di reperire i dati, operarvi le modifiche necessarie e renderli disponibili; il designer si occupa di creare le presentazioni inserendo al posto dei dati effettivi dei marcatori speciali; il template engine fonde i due aspetti: prende i dati forniti dalla parte applicativa, e li inserisce al posto dei marcatori prestabiliti.“

Bene, tutto molto utile. Ma allora perchè non ami i Template Engine?

Per uno motivo molto semplice: li reputo un “layer” inutile, superfluo.

Molti sono soliti associare il concetto di separazione del contenuto dalla presentazione all’adozione di un Template Engine. Ma, in realtà, si può tranquillamente separare il contenuto dalla presentazione facendo benissimamente a meno di un Template Engine. Ecco perchè è inutile. Sicuramente, gli utilizzatori incalliti di Template Engine, mi avranno insultato dopo aver letto queste mie parole… machissenefrega

Un Template Engine non eguaglia le performance del codice PHP nativo in quanto, il codice del Template Engine, dovrà essere riconvertito in codice nativo al momento dell’esecuzione. Poi, da un punto di vista sintattico, il designer non è che sia particolarmente agevolato, vediamo in questo esempio:

Codice nativo

<ul>
<?php foreach ($users as $item) { ?>
<li><?php echo $item; ?></li>
<?php } ?>
</ul>

Codice Template Engine

<ul>
{foreach from=$users item=item}
<li>{$item}</li>
{/foreach}
</ul>

Ecco, fornire al designer una funzione/API (o chiamiamola come preferiamo) di questo genere, può essere una soluzione senza dubbio comoda per lui…ed è anche in codice nativo:

<ul>
<?php output($users); ?>
</ul>

In sostanza, per separare il contenuto dalla presentazione, la differenza la fa la fase di analisi e progettazione…non l’adozione o la non adozione di un Template Engine. Scegliere un buon Framework PHP che adotta il Pattern MVC è un ottimo punto di partenza e, sembra banale ma non lo è, massima collaborazione e intesa tra Developers e Designers sono sufficienti…con la speranza che non vi imbattiate in uno di questi ambigui personaggi

Pubblicato in: PHP, Programmazione, Scripts | 6 Commenti »

Invia questo articolo a un amico via email

PHP get URL from HTML: Estrarre i links di una pagina html con l’oggetto DOM di PHP5

Pubblicato il 2/12/2011 alle 21:04

emawebdesign

Se abbiamo necessità, nella nostra applicazione web, di estrarre tutti i link presenti in una pagina web, una soluzione comoda è quella di utilizzare l’oggetto DOM di PHP5.

Vediamo come realizzare una semplice funzione che, tramite la classe DOMDocument, restituisce gli attributi href e text sottoforma di array multidimensionale:

function getUrlFromHTML($url) {
 
    $xml = new DOMDocument();
 
    @$xml->loadHTMLFile($url);
 
    $links = array();
 
    foreach($xml->getElementsByTagName('a') as $link) {
        $links[] = array('url' => $link->getAttribute('href'), 'text' => $link->nodeValue);
    }
 
    return $links;
}
 
$arr = getUrlFromHTML("http://www.emawebdesign.com");

Servendoci di un ciclo FOR, ecco come possiamo visualizzare il contenuto dell’array:

for ($i=0;$i<count($arr);$i++) {
echo $arr[$i]["url"] ."<br />";
echo $arr[$i]["text"] ."<br />";
}

Semplice e comodo

Pubblicato in: PHP, Programmazione, Scripts | Nessun commento »

Invia questo articolo a un amico via email

Developers, gli Indigeni Digitali stanno organizzando un magnifico evento per voi!

Pubblicato il 17/11/2011 alle 23:05

Sei uno sviluppatore? PHP, jQuery e MySQL sono il tuo pane quotidiano?

Programmi per iOS oppure per Android? Allora nessuno è più figo di te!!

Gli Indigeni Digitali stanno organizzando un magnifico evento per te e per chiunque programma e ama scrivere righe su righe di codice, sviluppare app, web app e migliorare la vita delle persone offrendo strumenti semplici e utili.

Facci sapere chi sei, compila il documento che trovi linkato in questo post del blog degli Indigeni Digitali.

Io l’ho già compilato, ora è il tuo turno, ci sarà da divertirsi

Pubblicato in: Indigeni Digitali, News, Programmazione, Scripts, Software | Nessun commento »

Invia questo articolo a un amico via email

MooTools Ajax: come effettuare richieste Ajax con MooTools

Pubblicato il 20/6/2011 alle 23:55

Nell’articolo “jQuery Ajax: come effettuare richieste Ajax tramite jQuery” abbiamo visto come poter effettuare delle chiamate Ajax utilizzando il noto framework JavaScript jQuery. Oggi vedremo come interagire con l’oggetto XMLHttpRequest utilizzando un altro famoso framework JS: MooTools.

Come sempre, vi invito a visionare la documentazione ufficiale sull’oggetto Request dove sono elencati e descritti i metodi che si possono utilizzare per costruire chiamate Ajax.

Nell’esempio, che vi illustro di seguito, troverete un div con identificatore univoco “output” dove visualizzeremo il risultato della chiamata che sarà una riga di testo o un paragrafo “lorem ipsum“. Tramite un pulsante con identificatore univoco “bttRequest” richiameremo una pagina PHP (request.php), tramite l’oggetto request, per ottenere in risposta il testo o il paragrafo a seconda di quello che invieremo come parametro “id“.

Se id contiene 1 otterremo in risposta la riga di testo, se contiene 2 otterremo, invece, il paragrafo lorem ipsum. Possiamo decidere cosa ottenere in risposta selezionando il valore comodamente da una select.

Diamo una rapida occhiata al codice HTML:

<div id="output">Status: ok</div>
<select id="choose" name="choose">
<option value="1" selected="selected">Text</option>
<option value="2">Lorem Ipsum</option>
</select>
<input type="button" id="bttRequest" value="Ajax Request" />

Visualizziamo ora il codice MooTools:

<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript">
 
window.addEvent('domready', function() {
 
		$('bttRequest').addEvent('click', function(event) {
 
		var value = $('choose').get('value');
 
				var myRequest = new Request({
					url: 'request.php',
					method: 'get',
 
					onRequest: function(){
						$('output').set('text', 'loading...');
					},
 
					onSuccess: function(responseText){
						$('output').set('text', responseText);
					},
 
					onFailure: function(responseText){
						$('output').set('text', 'Errore nella richiesta!');
					}
 
				});
				myRequest.send('id=' + value);
		});
 
});
 
</script>

Questo è il codice della pagina PHP:

<?php
 
if ($_GET["id"]==1) {
echo "This is the text";
}
 
if ($_GET["id"]==2) {
echo "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.";
}
 
?>

Potete vedere il codice in azione a questo indirizzo e scaricare i files sorgenti qui sotto

download: MooTools Ajax (39.01KB)
added: 20/06/2011
clicks: 248
description: Come effettuare richieste Ajax con MooTools.

Pubblicato in: Ajax, JavaScript, MooTools, Programmazione, Scripts | Nessun commento »

Invia questo articolo a un amico via email

Lightbox per visualizzare foto e gallery: i migliori scripts

Pubblicato il 30/3/2011 alle 00:13

In ogni sito che si rispetti, una cosa che non può assolutamente mancare, è l’effetto “lightbox” per la visualizzazione di foto e gallery fotografiche. Il lightbox lo si trova in rete come script realizzato con framework come jQuery, MooTools o Prototype; è molto conosciuto e apprezzato da addetti ai lavori e utenti ed implementarlo è davvero semplice e veloce.

Vediamo, ora, quali sono gli script più usati ed apprezzati per implementare l’effetto “lightbox“:

01) Lightbox2 (demo)

02) ColorBox (demo)

03) FancyBox

04) FancyZoom

05) ImageZoom

06) LyteBox

07) PiroBox

08) ShadowBox (demo)

09) SlimBox

10) ThickBox

11) BumpBox (demo)

12) FaceBox

Se ne conosci altri segnalaceli nei commenti

Pubblicato in: Foto e immagini, JavaScript, jQuery, MooTools, Prototype, Risorse, Scripts | 2 Commenti »

Invia questo articolo a un amico via email

PHP pathinfo: ottenere informazioni su un file

Pubblicato il 17/1/2011 alle 06:54

Molto spesso, in un’applicazione web, abbiamo la necessità di implementare un filemanager o, comunque, di visualizzare le informazioni su uno o più file ospitati sul server.

PHP ci mette a disposizione la funzione pathinfo con cui possiamo facilmente ricavare per ogni file:

- nome della directory dove risiede il file
- nome del file completo di estensione
- estensione del file

A partire dalla versione 5.2.0 di PHP è possibile anche ricavare il nome del file senza l’estensione.

Ecco un esempio di utilizzo:

<?php
 
$file = pathinfo('file.jpg');
 
echo "dirname: " .$file['dirname'], "<br />";
echo "basename: " .$file['basename'], "<br />";
echo "extension: " .$file['extension'], "<br />";
echo "filename: " .$file['filename'], "<br />";
 
?>