ClueTip con Symfony

Oggi vi mostrerò un esempio di come usare un cluetip (jQuery Plugin) in un applicazione sviluppata in Symfony.

Gli step da seguire sono i seguenti:

  1. Template sul quale si visualizzerà il cluetip e verrà effettuata la chiamata all’action
  2. Action che restituisce i valori da visualizzare nel cluetip
  3. Template del cluetip

Prima di iniziare a mostrare il codice, ricordarsi di scaricare l’ultima versione del js e css di cluetip che potete reperire al seguente link.

Passo 1:

<script type=”text/javascript”>
$(function() {

$(‘.clu_test’).cluetip({tracking: true});

});
</script>

<a href=”” rel=”<?php echo url_for(‘module/action?id=’.$id) ?>” title=”Titolo cluetip” class=”clu_test”>Click me!</a>

In rel va inserito l’url della chiamata che si vuole effettaure.

Passo 2:

public function executeAction(sfWebRequest $request) {

$this->risultato = // fai qualcosa con il parametro passato “$request->getParameter(‘id’)”

}

Passo 3:

creare il template relativo all’action del passo 2 (actionSuccess.php), dove mostreremo il nostro risultato ($risultato) ottenuto dall’action.

Con questi 3 semplici passi, avremo il nostro cluetip. In questo esempio è stato usato il cluetip con il parametro tracking, questo permette di spostare la finestrina del cluetip in base allo spostamento del mouse sul nostro tag a (passo 1).

Per ulteriori esempi, potete consultare il seguente link.

Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...