SaCaWeb « il Blog

Lettere maiuscole accentate in php utf8

10 ago

Può capitare di voler trasformare in php una frase in maiuscolo e che questa contenga dei caratteri accentati.
Premessa : i caratteri DEVONO essere codificati in utf8.
Ho visto in giro per il web una miriade di funzioni che sostituiscono tutti i possibili caratteri accentati, sia con l’uso delle regexp sia con str_replace…non serve nulla di tutto ciò.
Ci viene in aiuto una funzione php :

string mb_strtoupper ( string $str [, string $encoding] )

ritorna una stringa con tutti i caratteri convertiti in maiuscolo e codificati in $encoding .

ad esempio:

$str = “àèìòù”;
echo mb_strtoupper($str ,”UTF-8″); // ÀÈÌÒÙ

lettere maiuscole, maiuscolo, strtoupper, uppercase utf8

Anti spam: nascondere indirizzo email

15 lug

Pubblicato da sacaweb in Strumenti utili

Nessun commento

Email obfuscator

antispam, email obfuscator, nascondere email, obfuscator

Popolare una select con javascript, jQuery, Ajax, php

20 apr

Pubblicato da sacaweb in Javascript/JQuery/Ajax

Nessun commento

Al giorno d’oggi il web è pieno zeppo di pagine che, grazie a richieste asincrone (ajax), aggiornano porzioni di esse senza effettuare un caricamento di tutta la pagina.

Un "problema" ricorrente è popolare una select in base alla scelta effettuata in un’altra select. Un esempio è quello delle regioni e città: si seleziona una regione dalla prima select e tramite ajax si popola la seconda select con le sole città della regione scelta. Ma ci sono migliaia di esempi e casi d’uso.

Guarda Demo

Vediamo come sia semplice realizzare tutto con l’aiuto di jQuery.

Come esempio base ci basta un file html che contiene le select ed un file php al quale viene inoltrata la richiesta asincrona e che ci restituisce i dati in base ai parametri passati.

Nella sezione head del file html:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"</script>
<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
	   $("select#primaselect").change(function(){
		 $.getJSON("select.php",{id: $(this).val()}, function(dati){
			var options = '';
			for (var i = 0; i < dati.length; i++) {
				options += '<option value="' + dati[i].valore + '">' + dati[i].etichetta + '</option>';
			}
			$("#secondaselect").html(options);
			$('#secondaselect option:first').attr('selected', 'selected');
		});
            });
      });
</script>

Nel body del file html:

<b>Scegli il tuo smartphone preferito:</b>
<select id="primaselect"><option value="">Scegli</option><option value="1">HTC</option><option value="2">SAMSUNG</option><option value="3">MOTOROLA</option>
</select>
<select id="secondaselect"></select>

Contenuto del file php:

<?php
 
  $dati = array();
 
  $id = $_GET['id'];
 
  if($id == 1){
     array_push($dati, array("valore"=>"cod_001","etichetta"=>"Desire HD"));
     array_push($dati, array("valore"=>"cod_002","etichetta"=>"Flyer"));
     array_push($dati, array("valore"=>"cod_003","etichetta"=>"Chacha"));
     array_push($dati, array("valore"=>"cod_004","etichetta"=>"HD2"));
  }
 
  if($id == 2){
     array_push($dati, array("valore"=>"cod_005","etichetta"=>"Galaxi S"));
     array_push($dati, array("valore"=>"cod_006","etichetta"=>"Wave II"));
     array_push($dati, array("valore"=>"cod_007","etichetta"=>"Omnia 7"));
     array_push($dati, array("valore"=>"cod_008","etichetta"=>"Omnia HD"));
 
  }
 
  if($id == 3){
     array_push($dati, array("valore"=>"cod_009","etichetta"=>"Atrix 4G"));
     array_push($dati, array("valore"=>"cod_010","etichetta"=>"Droid Bionic"));
     array_push($dati, array("valore"=>"cod_011","etichetta"=>"Cliq 2"));
     array_push($dati, array("valore"=>"cod_012","etichetta"=>"Bravo"));
 
  }
 
   echo json_encode($dati);
?>

In questo caso il file php recupera i dati da alcuni array costruiti ad hoc per l’esempio, ma nulla vieta (anzi si spera) che i dati siano recuperati da un db.

Per qualsiasi chiarimento, a disposizione.

Guarda demo

Ajax, php, popolare select, popolare select dinamicamente

Riscrivere url dinamicamente con jQuery

4 apr

Pubblicato da sacaweb in Javascript/JQuery/Ajax

Nessun commento

Com’è noto, Ajax permette di effettuare richieste asincrone ad un web server via Javascript, senza ricaricare la pagina e senza cambiare url nella barra degli indirizzi.

Le richieste asincrone effettuate con Ajax hanno spesso lo scopo di modificare parti della pagina html. Effettuando varie richieste consecutive, ci si può trovare innanzi ad una pagina completamente diversa da quella iniziale, ma con uno stesso url nella barra degli indirizzi!

Esempio: Il sito www.sitodiannunci.it, alla pagina annunci.php permette di navigare tra gli annunci di una categoria mediante due pulsanti avanti e indietro. Il contenuto della pagina annunci.php cambia, mostrando i dati relativi al nuovo annuncio caricati via Ajax.

Dopo varie pressioni dei pulsanti avanti e indietro, l’utente decide di salvare la pagina tra i preferiti perchè interessato all’annuncio. Cosa succede? Viene salvata la stringa www.sitodiannunci.it/annunci.php, ma da questa non si riesce a risalire all’annuncio di interesse. E’ chiaro che servirebbe una variabile da aggiungere alla query string che identifichi univocamente un annuncio, tipo www.sitodiannunci.it/annunci.php?id=123.

Se si modifica l’url della pagina ad ogni annuncio con un linguaggio lato server tipo php, si ottiene il ricaricamento della pagina che non è un effetto voluto (altrimenti perchè stiamo usando Ajax?). Stesso risultato se modifichiamo la proprietà window.location.href via javascript. Allora come risolvere???

Ci viene in aiuto una proprietà poco conosciuta dell’oggetto location javascript: window.location.hash.

La stringa contenuta in window.location.hash sarà aggiunta in coda all’url della pagina, preceduta dal simbolo cancelletto # , senza ricaricare la pagina, ad esempio www.sitoannunci.it/annunci.php#123

Salvando nei preferiti www.sitoannunci.it/annunci.php#123 la proprietà window.location.hash conterrà la stringa 123 che può servire a risalire all’annuncio di interesse.

Abbiamo visto come risalire al contenuto di un annuncio impostando e poi leggendo la proprietà javascript window.location.hash .

E non è tutto. Si poteva mai parlare di javascript senza nominare jQuery??? Certo che no. Esiste infatti un plugin, jquery.history, che rende tutto semplicissimo.

jQuery history plugin aiuta a supportare i pulsanti avanti/indietro ed il bookmarks nelle applicazioni javascript. Permette di salvare lo stato nell’url hash e di ripristinarlo.

live demo ( consultare il codice sorgente )

Ci sono 2 metodi per interagire con l’oggetto jQuery.history:

jQuery.history.init(callback [, options])

Inizializza il plugin e va richiamato una volta quando la pagina è completamente caricata.

jQuery.history.load(hash)

Carica una stringa in location.hash,crea una nuova entry nella storia della navigazione e invoca la funzione di callback se necessario. A meno che l’hash passato come parametro sia diverso da quello corrente, la funzione di callback non è invocata.

Documentazione completa (in inglese)

Ajax, jquery history, riscrivere url dinamicamente, window.location.hash

jQuery Vertical Scroller Plus Plugin

23 feb

Pubblicato da sacaweb in Javascript/JQuery/Ajax

2 commenti

Ho scritto questo plugin jQuery che trasforma un div contenitore(wrapper) che contiene un div figlio(scroller) in un riquadro con contenuto scorrevole verticalmente usando due pulsanti su e giù.

Guarda la demo live

Testato e funzionante anche su dispositivi mobili touch screen iphone e Android !

Il contenuto del div scroller può essere qualsiasi elemento html (anche solo una tabella, a differenza di altri plugin! )

Il plugin calcola automaticamente l’altezza del div scroller.

Si possono utilizzare più istanze di scroller nella stessa pagina cambiando semplicemente gli id del div wrapper, del div scroller e dei pulsanti.

Si può impostare di quanti pixel deve scorrere il contenuto e la velocità di scorrimento.

Facilissimo da usare:

basta creare due div, uno dentro l’altro;
il div esterno sarà il contenitore;
il div interno sarà lo scroller;
due pulsanti per scorrere su e giù;
tutti gli elementi inseriti all’interno del div scroller scorreranno alla pressione dei pulsanti.

<div id="wrapper" style="width:350px;height:120px;">
	<div id="scroller">. . . </div>
</div>
<p><input id="su_btn" type="button" value="su" /> 
<input id="giu_btn" type="button" value="giù" /></p>

Includere i files jQuery e applicare il plugin al div contenitore:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script type="text/javascript" src="jquery.verticalscrollplus-1.0.js"></script>
<script language="JavaScript" type="text/javascript">
  $(document).ready(function(){
      $("#wrapper").verticalScrollPlus({step:100});
      $("#wrapper2").verticalScrollPlus({speed: 1500, step: 50, upID: "#su_btn2", downID: "#giu_btn2", scrollerID:"#scroller2" });
  });
  </script>

Se reputi che il jQuery Vertical Scroller Plus Plugin ti sia stato utile, pensa ad una libera donazione come incentivo allo sviluppo futuro. Ti ringrazio anticipatamente.

Il plugin può essere scaricato da:

http://plugins.jquery.com/content/verticalscrollerplus-10

Plugin options:

speed : quanto è veloce l’animazione di scorrimento verticale;(default = 500)
step: di quanti pixel scorre il contenuto ad ogni pressione di tasto su oppure giù;(default = 60)
upID: id dell’elemento che fa partire l’animazione verso su;(default = #su_btn)
downID: id dell’elemento che fa partire l’animazione verso giù;(default = #giu_btn)
scrollerID: id dell’elemento il cui contenuto scorrerà verticalmente;(default = #scroller)

jquery, scroller, scrolling, vertical scroller

Etichetta di caricamento Ajax tipo Google

20 gen

Pubblicato da sacaweb in Javascript/JQuery/Ajax

1 commento

Oggi vediamo un modo per realizzare un avviso di loading Ajax tipo Google.

Mi riferisco alla etichetta di loading che compare in alto nella pagina ogni qualvolta eseguiamo un’azione tipo eliminare un messaggio (che evidentemente effettua richieste Ajax) all’interno ad esempio di GMail.

Con l’aiuto di JQuery diventa tutto semplicissimo. Vedi la demo live.

Di seguito la parte più importante del codice javascript:

$(document).ready(function(){
 
         /* quando si preme il pulsante si carica il contenuto da un file di testo  */
         $('#loadingbtn').click(function(){
             $('#contenuto').load('file.txt');
         });
 
         /* quando parte la richiesta Ajax mostra il div di loading, quando la richiesta
            viene completata nasconde il div  */
         $('#loading').ajaxSend(function(){
           $(this).fadeIn('slow');
         }).ajaxComplete(function(){
           $(this).fadeOut('slow');});
 
 });

Di seguito il codice html della pagina:

<p>Clicca sul pulsante per caricare via Ajax del contenuto nel div sotto</p>
 
<input type="button" id="loadingbtn" name="loadingbtn" value="Carica contenuto" />
<br /><br />
<div id="contenuto" name="contenuto"></div>
 
<div id="loading" name="loading">Loading...</div>

Importante la regola css che imposta lo stato iniziale dell’avviso di loading su invisibile, in quanto è su questa che va ad agire javascript al verificarsi degli eventi ajaxSend e ajaxComplete.

#loading{
  position:fixed;
  top:0;
  left:0;
  background-color: green;
  color:white;
  width: 80px;
  display:none;
}

Ajax Loading Google Like

Selezionare radiobox da jQuery

29 dic

Pubblicato da sacaweb in Javascript/JQuery/Ajax

1 commento

Quando selezioniamo un componente radiobox col mouse succedono almeno due cose:

Il pallino del radiobox viene annerito ad indicare che è selezionato;
Viene lanciato un evento javascript di tipo onchange, che volendo può essere intercettato.

Supponiamo di avere un gruppo di radiobox che rappresentano colori:

<input name="colori" type="radio" value="red" /> Rosso 
<input name="colori" type="radio" value="green" /> Verde 
<input name="colori" type="radio" value="blue" /> Blu
 
<span id="risposta"></span>

Grazie alla potenza di jQuery è semplice intercettare l'evento onchange quando si seleziona un radiobox:

$("input[name=colori]:radio").change(function(){
    $("#risposta").html(this.value);
    $("#risposta").css("color",this.value);
});

Quando si seleziona un radiobox, il corrispondente colore viene scritto in un elemento span con id="risposta". Da notare anche come sia semplice modificare lo stile di un elemento.

Ma come si potrebbe simulare il click del mouse da jQuery?

 
var colore ="red";
 
if(colore != ""){
   $("input[value="+colore+"]:radio").attr('checked', true);
}

Attraverso il metodo attr(), risulta semplice modificare l'attributo checked del radiobox.

Sembrerebbe bastare, ma la modifica dell'attributo checked attraverso il metodo attr() ottiene come risultato la sola selezione del radiobox, senza lanciare alcun evento onchange.

Dando il valore “red” alla variabile colore, si ottiene la selezione del radiobox corrispondente, ma non viene scritto nulla nell'elemento con id=”risposta”. Questo perchè attraverso la sola modifica dell'attributo col metodo attr() non viene lanciato l'evento onchange.

Si può però lanciare l'evento onchange manualmente attraverso il codice

 
 $("input[value="+colore+"]:radio").change();

Il codice finale è

<input name="colori" type="radio" value="red" />Rosso
<input name="colori" type="radio" value="green" />Verde
<input name="colori" type="radio" value="blue" />Blu
 
<span id="risposta"></span>
 
<script type="text/javascript">
var colore ="red";
 
if(colore != ""){
    $("input[value="+colore+"]:radio").attr('checked', true);
}
 
$("input[name=colori]:radio").change(function(){
         $("#risposta").html(this.value);
         $("#risposta").css("color",this.value);
});
 
$("input[value="+colore+"]:radio").change();
</script>

Guarda il risultato

MySQL:Massimo tra due colonne di due tabelle

21 dic

Pubblicato da sacaweb in Php/MySQL

2 commenti

Prendiamo in considerazione due tabelle di esempio in un db MySQL:

tabella 1
id	nome	stipendio
1	Andrea	1200
2	Francesco	1300

tabella 2
id	nome	stipendio
1	Antonio	1250
2	Gianluca	1350

Per un motivo qualsiasi ci servirebbe conoscere lo stipendio in assoluto più alto, cioè il più alto valore del campo stipendio relativamente alle due tabelle.

Una soluzione rapida, anche se poco elegante è la seguente:

SELECT max(stipendio) AS massimo
FROM tabella1
 
UNION
 
SELECT max(stipendio) AS massimo
FROM tabella2
 
ORDER BY massimo DESC LIMIT 1

Il risultato è:

massimo
1350

Molto utile l’operatore UNION che unisce gli insiemi restituiti dalle due interrogazioni SELECT in uno solo.

Da notare la presenza delle clausole ORDER BY e LIMIT; la prima ordina i risultati dal più grande al più piccolo e la seconda limita questi risultati ad uno solo che poi è il più grande. Senza queste due clausole il risultato sarebbe stato :

massimo
1300
1350

LIMIT, max, MySQL, ORDER BY, SELECT, SQL, UNION

Amministrazione Virtuemart da Joomla Frontend

13 dic

Pubblicato da sacaweb in Php/MySQL

1 commento

Scenario : sito web ecommerce con Joomla e Virtuemart.

Capita di voler permettere l’accesso all’amministrazione di Virtuemart senza passare dalla solita Login raggiungibile all’indirizzo url

 www.tuosito.it/administrator

, ma direttamente dal componente Login del Frontend di Joomla.

Nel caso in cui si dovessero verificare dei problemi di visualizzazione, quelle seguenti potrebbero essere delle soluzioni:

Accedere tramite ftp allo spazio web che ospita il sito ed abilitare permessi di esecuzione (755) al file
```
http://www.tuosito.it/components/com_virtuemart/fetchscript.php
```
questo si occupa di includere alcuni file javascript e fogli di stile necessari alla corretta visualizzazione.

Per amministrare Virtuemart da Joomla frontend modificare il file

http://www.tuosito.it/administrator/components/com_virtuemart/html/product.product_list.php

alla linea 287:

$link = $_SERVER['PHP_SELF'] . "?page=$modulename.product_form&amp;limitstart=$limitstart&amp;keyword=".urlencode($keyword) . "&amp;product_id=" . $db->f("product_id")."&amp;product_parent_id=".$product_parent_id;

aggiungendo all’inizio dell’url ‘pshop_mode=admin‘ diventa:

$link = $_SERVER['PHP_SELF'] . "?pshop_mode=admin&amp;page=$modulename . product_form&amp;limitstart=$limitstart&amp;keyword=" . urlencode($keyword) . "&amp;product_id=" . $db->f("product_id") . "&amp;product_parent_id=" .$product_parent_id;

Questo evita che l’interfaccia di amministrazione di Virtuemart compaia all’interno di una pagina di Joomla nell’area del contenuto, lasciando visibili anche l’header con eventuali menu.

joomla, pshop_mode, virtuemart

Ciao mondo!!

10 nov

Pubblicato da sacaweb in Css

Nessun commento

Benvenuto nel mio Blog!

Cercherò di aggiornarlo quotidianamente con soluzioni a problemini di programmazione Php, Javascript, Css, Actionscript, Java, Java EE, che quotidianamente qualsiasi Webmaster o Web Developer si trova ad affrontare, nella speranza di far risparmiare del tempo…

actionscript, css, java, javascript, jquery, photoshop, php

Email obfuscator

jQuery.history.init(callback [, options])

jQuery.history.load(hash)

Articoli recenti

Tag