Ho cominciato a studiarmi un pò Mustache per Javascript, caricando i dati tramite AJAX.

Oltre a Mustache.js, avremmo bisogno anche di jQuery; infine useremo un file di template esterno (giusto per fare un esempio più completo.

Mustache.js lo potete scaricare da GitHub (ho dovuto copiarlo in locale, il caricamento remoto non mi funzionava).

Ho trovato un plugin per jQuery che permette di creare pannelli dentro una pagina web in maniera veramente easy: jsPanel!

Se guardate gli esempi e la documentazione, potete notare che le possibilità sono veramente tante.

C'è anche l'integrazione con la prossima versione di Bootstrap, ed è possibile creare pannelli espandibili, finestre modali, toolbar, menu contestuali, ecc.

Insomma tanta roba.

La necessità è quella di bloccare un div (nel mio caso, ma è fattibile anche per altri componenti) durante lo scroll della finestra.

Quindi, nel momento in cui lo scroll arriva ad una certa altezza, il div si deve bloccare e scorrere con la pagina.

Il CSS di partenza del div in questione non ha nulla di speciale:

.row_col_head { height: 12mm;border-bottom: 1px solid black;background-color:white; }

Per Javascript / jQuery, esistono tantissimi plugin per eseguire operazioni sulle tabelle.

Ma se voglliamo applicare un semplice filtro, ricercando in una input text, non abbiamo bisogno di chissa qualche plugin o libreria.

Partiamo da un HTML del genere (io la riempi tramite PHP, ma è indifferente):

<div class="input-field">
                            <input type="text" id="search_suffix" onkeyup="searchTable('tbl_suffix', 'search_suffix');" placeholder="Search..">
                        </div>
                        <table id="tbl_suffix" class="striped responsive-table tbl_cou">
                            <thead>
                                <tr>
                                    <th>SUFFIX</th>
                                    <th>DESCRIPTION</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php foreach ($query as $var): ?>
                                    <tr>
                                        <td><?php echo $var['mime_suffisso']; ?></td>
                                        <td><?php echo $var['mime_descrizione']; ?></td>
                                    </tr>
                                <?php endforeach; ?>
                            </tbody>
                        </table>

Nelle versioni precedenti alla 5, per suddividere la pagina in più parti, si usavano i frame.

Nella versione 5 dell'HTML, e con l'avvento dei CSS 3, i frame risultano deprecati.

In alcuni casi, però, può risultare comodo avere le stesse funzionalità dei frame, senza doverli usare.

Girovagando ho trovato un plugin per jQuery che fa proprio questo: Splitter!