dropdown

Mattepuffo's logo
Riempire una DropDownList in VB.NET da database

Riempire una DropDownList in VB.NET da database

Per motivi lavorativi sono approdato al VB.NET.

Non era nei miei obiettivi, ma a questo punto ne approfitto!

Oggi vediamo come riempire una DropDownlist in Asp.NET da database.

Quindi, nella pagina avremmo una cosa del genere:

<asp:DropDownList runat="server" ID="dropCategorie" required></asp:DropDownList>

Mattepuffo's logo
Multi level dropdown menu in Twitter Bootstrap

Multi level dropdown menu in Twitter Bootstrap

Twitter Bootstrap già ci mette a disposizione gli strumenti per creare dei menu dropdown.

Di default non abbiamo strumenti per il menu multi dropdown.

Ma possiamo ovviare con un pò di CSS.

Prima di tutto vediamo la struttura HTML:

<ul class="nav navbar-nav">
    <li><a href="">Home</a></li>
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
            MULTI<b class="caret"></b></a>
        <ul class="dropdown-menu">
            <li><a href="">VOCE 1</a></li>
            <li><a href="">VOCE 2</a></li>
            <li class="dropdown-submenu">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">voce 3</a>
                <ul class="dropdown-menu">
                    <li><a href="">VOCE 4</a></li>
                    <li><a href="">VOCE 5</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="">Logout</a></li>
</ul>

Mattepuffo's logo
Twitter Bootstrap Navbar Dropdown Hover

Twitter Bootstrap Navbar Dropdown Hover

Twitter Bottstrap offre di default sia una Navbar che il classico Dropdown.

Se guardate qua vedrete che è anche possibile combinare le due cose.

Il comportamento di default, però, prevede il click per aprire la lista, mentre io voglio aprirla passandoci sopra.

Vediamo come fare.

Partiamo dal codice HTML:

<div class="navbar navbar-inverse navbar-fixed-top">
                <div class="navbar-inner">
                    <a class="brand" href="#"></a>
                    <ul id="tab" class="nav">
                        <li class="active"><a href="home.php">Home</a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">DD<b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="">Voce 1</a></li>
                                <li><a href="">Voce 2</a></li>
                                <li><a href="">Voce 3</a></li>
                                <li><a href="">Voce 4</a></li>
                            </ul>
                        </li>
                        <li><a href="">Logout</a></li>
                    </ul>
                </div>
            </div>

Come vedete abbiamo una prima voce normale, poi una voce con class="dropdown" che al suo interno ha una seconda lista e prima un link che servirà per aprire la lista (è fondamentale).

Infine un'altra voce normale.