javascri

Mattepuffo's logo
Canvas con altezza e larghezza al 100%

Canvas con altezza e larghezza al 100%

L'elemento <canvas> di HTML5 è un elemento un pò particolare perchè nasce con lo scopo di crearci animazioni dentro.

In generale, quindi, deve avere un'altezza e una larghezza precise.

In alcuni casi potrebbe essere necessario fare in modo che sia automaticamente all 100% rispetto all'elemento in cui si trova.

Abbiamo due possibilità.

Mattepuffo's logo
Geolocalizzazione con Javascript

Geolocalizzazione con Javascript

Tra i nuovi oggetti diposnibili nelle API Javascript di HTML 5 troviamo anche ciò che riguarda la Geolocalizzazione.

In pratica, senza usare strumenti esterni come Google Maps, siamo in grado di identificare le coordinate del browser.

Ovviamente non tutti i browser supportano questa funzionalità, quindi nel caso dovete fare affidamento ad altri strumenti.

Qui trovate una buona guida, e sotto una funzioncina per fare quello ci serve; tenete in considerazione anche che la Geolocalizzazione richiede il permesso da parte degli utenti (in verità dipende dal browser, ma tutti ad oggi richiedono il permesso all'utente).

Mattepuffo's logo
Creare un array in Javascript da php

Creare un array in Javascript da php

A volte può capitare di dover creare un array in Javascript prendendo i dati da PHP.

Nel mio caso eseguo una query e i dati che prendo da PHP li devo spezzare e metterli dentro a delle input text.

La parte in PHP sarà una cosa del genere:

<?php

foreach ($objCerca->getCliente($_GET['id']) as $var) {
    echo $var['an_codice'] . ',', $var['an_ragsoc'] . ',', $var['an_piva'] . ',', $var['an_cf'];
}

La funzione getCliente() si occupa di eseguire la query (non mi soffermo su questo punto) e di inviare i dati separati da virgola, come li vuole JS per gli array.

Mattepuffo's logo
jQuery Validate con array di input

jQuery Validate con array di input

In un precedente articolo ho mostrato come usare il plugin jQuery Validate per la validazione dei form.

Partendo da la vediamo come poter validare il form in caso che ci siano più input con lo stesso nome.

<form action="#" id="frm_email_amici" method="post">
    <dl>
        <dt><label for="emailam">Invita almeno tre amici per diventare Gold</label></dt><br/>
        <dd><input type="text" name="emailam[]" value="" /></dd>
    </dl>
    <dl>
        <dd><input type="text" name="emailam[]" value="" /></dd>
    </dl>
    <dl>
        <dd><input type="text" name="emailam[]" value="" /></dd>
    </dl>
    <dl>
        <dd><input type="text" name="emailam[]" value="" /></dd>
    </dl>
    <dl>
        <dd><input type="text" name="emailam[]" value="" /></dd>
    </dl>
    <dl>
        <dd><input class="inviaeli" type="submit" value="Invia" name="btn_email_amici" /></dd>
    </dl>
</form>

Qua ci sono 5 input text che hanno lo stesso nome, e alla parte in PHP gliele passo come array.

Mattepuffo's logo
Facebook events in Javascript

Facebook events in Javascript

Molto spesso si crea l'esigenza di eseguire del codice personale quando l'utente clicca sul Like di Facebook che abbiamo implementato nelle nostre pagine web.

Ad esempio, nel mio caso, quando un utente fa il like deve cambiare tipo di account.

FB mette a disposizione di noi sviluppatori la possibilità di interagire con i suoi eventi.

Nello specifico qui trovate tutti i possibili eventi da usare.

Noi faremo un esempio sul Like (l'unico che mi è servito); diciamo che gli altri sono uguali, cambia solo il nome dell'evento.

Mattepuffo's logo
jQuery UI Datepicker: non visualizzare le date antecedenti a oggi

jQuery UI Datepicker: non visualizzare le date antecedenti a oggi

E torniamo a parlare di jQuery UI Datepicker, il componente calendario di jQuery UI.

In pratica, in attesa di HTML 5 come standard, uso sempre quello come calendario ormai.

In un sito che sto sviluppando mi è stato richiesto di non visualizzare / oscurare i giorni antecedenti a quello odierno.

Questo per evitare che si possano fare ordinazioni a una data "inutile".

Per ottenere questo dobbiamo far ricorso all'opzione minDate e all'oogetto Javascript Date().