jquery mobile

Mattepuffo's logo
Impostare più di due bottoni nell'header in jQuery Mobile

Impostare più di due bottoni nell'header in jQuery Mobile

Se andiamo a vedere la documentazione di jQuery Mobile, vedremmo diversi esempi di bottoni sull'header.

Ma gli esempi si limitano ad un massimo di due bottoni, uno a destra e uno a sinitra del titolo.

Questo perchè, in verità, di default non sono previsti casi più particolari.

Oggi vediamo come impostarne più di due, tre nel caso specifico.

Per farlo ci basterà usare alcune direttive di JQM.


Warning: getimagesize(https://www.mattepuffo.com/blog/../IMMAGINI_ARTICOLI/jquery-mobile.png): failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /web/htdocs/www.mattepuffo.com/home/blog/tag.php on line 25
Mattepuffo's logo
Chiudere un Panel in jQuery Mobile

Chiudere un Panel in jQuery Mobile

Vediamo un piccolo tip per chiudere un componente Panel in jQuery Mobile.

Un primo modo, visibile anche nella documentazione, è quello di usare un tasto apposito:

 <li data-icon="delete"><a href="#" data-rel="close">Close menu</a></li>

Qui si usa l'attributo data-rel="close".

Mattepuffo's logo
jQuery Mobile Listview filter

jQuery Mobile Listview filter

Supponiamo di avere una jQuery Mobile Listview con parecchi elementi.

Come fare per poter ricercare all'interno soltanto determinati elementi?

Molto semplicemente aggiungendo gli attributi giusti!

Prima di tutto date un'occhiata agli esempi basici che potete trovare qua.

Se vedete più sotto c'è anche l'esempio per il filter.

Mattepuffo's logo
Passare parametri tra le pagine in jQuery Mobile

Passare parametri tra le pagine in jQuery Mobile

Se abbiamo un'applicazione multi-pagina con jQuery Mobile, e vogliamo passare parametri tra le varie pagine, non ci basta usare i classici parametri in GET; dobbiamo arrangiarci in altro modo.

Io personalmente ho usato sessionStorage!

In pratica nel link setto tutti i valori che mi servono usando setItem, e nella pagina di arrivo li prendo con getItem.

Quindi, il nostro link sarà una cosa del genere:

                             <a href="#page_up_tempo" data-transition="slideup"
                               onclick="
                                           sessionStorage.setItem('nome', 'MATTE');
                                           sessionStorage.setItem('cognome', 'PUFFO');
                               ">

A questo punto dobbiamo prendere i valori nella pagina page_up_tempo.

Mattepuffo's logo
jQuery Mobile Datepicker

jQuery Mobile Datepicker

jQuery Mobile lo conosciamo, è un ottimo framework basato su jQuery indirizzato al mobile.

Tra i componenti ne manca uno essenziale, a mio parere: un datepicker.

In giro ci sono vari datepicker indirizzati al mobile, e tra questi io personalmente ho scelto DateBox.

Le opzioni, come potete vedere, sono tantissime e l'aspetto grafico in perfetto stile jQuery Mobile.

Mattepuffo's logo
Valore di default in una select con jQuery Mobile

Valore di default in una select con jQuery Mobile

Creare un componente select in jQuery Mobile non è niente di speciale.

Basta il classico codice HTML, condito magari da qualche attributo per lo stile.

Ma quando si tratta di impostare un valore di default, non basta il classico attributo selected.

Bisogna agire di Javascript con un piccolo trucco.

Prima di tutto dobbiamo considerare l'evento pageshow di JQM; è qui che andremo a fare il tutto.