如何使用mvc4中的选项创建引导程序下拉列表 [英] How to create bootstrap dropdown with options in mvc4

问题描述

我想在bootstrap日历下拉列表中显示以下选项。

I want to display in bootstrap calendar drop down list with the below options.

" Last 1 hour", "Last 24 hours, "Last 7 days", "Date and Time Range" and "All" 

如何在mvc4中创建



我尝试过：



我有尝试所有都与日期和时间有关，但无法找到自定义日历下拉列表。

How to create this in mvc4

What I have tried:

I have tried all are related to date and time but not able to find out customized calendar dropdown.

推荐答案

由于MVC助手中的构建不支持Bootstrap，您有两个选择：

1.写一个新助手来创建这样的下拉列表。这里有一个示例：如何将Bootstrap下拉样式应用于ASP.NET MVC DropDownList？ - Stack Overflow [ ^ ]



2.使用纯HTML：

As the build in MVC helpers do not support Bootstrap you have two options:
1. Write a new helper that will create such dropdown. There is a sample here: How to apply Bootstrap dropdown style to an ASP.NET MVC DropDownList? - Stack Overflow[^]

2. Use plain HTML:

<div class="dropdown">
  <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    @foreach (var item in [Your model to hold the data])
    {
      <li><a href="#" data-value="@item.Value">@item.Text</a></li>
    }
  </ul>
</div>

或

or

<div class="dropdown">
  <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    <li><a href="#">Last 1 hour</a></li>
    <li><a href="#">Last 24 hours</a></li>
    ...
  </ul>
</div>

这篇关于如何使用mvc4中的选项创建引导程序下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！