laurence keith albano
laurence keith albano

Reputation: 1482

Styling Asp:Dropdownlist and Asp:ListItem using Bootstrap?

just a quick question, How do you style an Asp:Dropdownlist and its ListItem using bootstrap?

Does it have to do with CssClass? From what the system says CssClass is not a valid attribute in the element ListItem. Can you add Span Class inside the text?

Here's a sample code:

<asp:DropDownList runat="server" id="dropdownrole" data-style="btn-primary" CssClass="dropdown-menu">
                    <asp:ListItem CssClass="btn-primary" Text="-- Select a user to proceed --"></asp:ListItem>
                    <asp:ListItem Text="Admin"></asp:ListItem>
                    <asp:ListItem Text="Student" ></asp:ListItem>
                    <asp:ListItem Text="Teacher"></asp:ListItem>
                </asp:DropDownList>

Upvotes: 1

Views: 7494

Answers (3)

Lokki
Lokki

Reputation: 382

Did you try this?
For me it was enough to add CssClass="form-control"

<asp:DropDownList CssClass="dropdown-menu form-control" runat="server" id="dropdownrole" data-style="btn-primary">

Upvotes: 1

Javier Vargas
Javier Vargas

Reputation: 807

I think you are looking for that:

<asp:DropDownList runat="server" CssClass="form-control"  id="dropdownrole" >
                    <asp:ListItem Text="-- Select a user to proceed --"></asp:ListItem>
                    <asp:ListItem Text="Admin"></asp:ListItem>
                    <asp:ListItem Text="Student" ></asp:ListItem>
                    <asp:ListItem Text="Teacher"></asp:ListItem>
                </asp:DropDownList>

I think you can't change the selects style with bootstrap, please read the selects section here. (scroll down)

Regards.

Upvotes: 1

Manraj
Manraj

Reputation: 494

 <asp:ListItem>Allahabad</asp:ListItem>

  <asp:ListItem>Kanpur</asp:ListItem>

  <asp:ListItem>Rewa</asp:ListItem>

  <asp:ListItem>Bhopal</asp:ListItem>

  <asp:ListItem>Indore</asp:ListItem>

  <asp:ListItem>Jabalpur</asp:ListItem>

Refer this:

http://www.mindstick.com/Blog/639/Dropdownlist%20using%20BootStrap%20in%20ASP%20Net#.VgUYlVanJ7Y

Upvotes: 0

Related Questions