bootstrap復選框和單選按鈕


復選框和單選按鈕標簽包含在<Label>標簽中
<div class="checkbox"> <label><input type="checkbox" value="">選項 1</label> </div> <div class="checkbox"> <label><input type="checkbox" value="">選項 2</label> </div>

<div class="radio">
   <label>
      <input type="radio" name="optionsRadios" id="optionsRadios1" 
         value="option1" checked> 選項 1
   </label>
</div>
<div class="radio">
   <label>
      <input type="radio" name="optionsRadios" id="optionsRadios2" 
         value="option2">
         選項 2 - 選擇它將會取消選擇選項 1
   </label>

內聯的復選框和單選按鈕,
  • 對一系列復選框和單選框使用 .checkbox-inline 或 .radio-inline class,控制它們顯示在同一行上。


<div>
   <label class="checkbox-inline">
      <input type="checkbox" id="inlineCheckbox1" value="option1"> 選項 1
   </label>
   <label class="checkbox-inline">
      <input type="checkbox" id="inlineCheckbox2" value="option2"> 選項 2
   </label>
   <label class="checkbox-inline">
      <input type="checkbox" id="inlineCheckbox3" value="option3"> 選項 3
   </label>
   <label class="checkbox-inline">
      <input type="radio" name="optionsRadiosinline" id="optionsRadios3" 
         value="option1" checked> 選項 1
   </label>
   <label class="checkbox-inline">
      <input type="radio" name="optionsRadiosinline" id="optionsRadios4" 
         value="option2"> 選項 2
   </label>
</div>

基架自動創建的Create 視圖的代碼:

如果是一個對象的成員是枚舉類型,基架的 Create視圖會自動生成枚舉類型的下拉菜單。 @Html.EnumDropDownListFor(model => model.NotificationType, htmlAttributes: new { @class =
"form-control" })

<div class="form-group">
@Html.LabelFor(model => model.NotificationType, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EnumDropDownListFor(model => model.NotificationType, htmlAttributes: new { @class = "form-control" })

 

雖然下面用的是@Html.EditorFor方法,但是 MVC框架能識別它是一個boolean類型,因此,會使用checkbox來渲染視圖。


<div class="form-group">
@Html.LabelFor(model => model.IsDismissed, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.IsDismissed)
@Html.ValidationMessageFor(model => model.IsDismissed, "", new { @class = "text-danger" })
</div>
</div>
</div>


@Html.ValidationMessageFor(model => model.NotificationType, "", new { @class = "text-danger" })
</div>
</div>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM