2017-10-20 26 views
0

我是非常新的asp.net核心。如何在asp.net核心中创建复选框列表?作为例子,列表显示课程,学生可以选择他们感兴趣的课程。在asp.net核心中的复选框列表

+1

我建议您阅读关于asp.net核心的基本教程。您将使用哪种技术创建客户端? Asp.net mvc还是例如angular?你的问题没有足够具体 – Tester

回答

-1
<asp:CheckBoxList ID="CheckBoxList1" runat="server"> 
     <asp:ListItem>Electronics</asp:ListItem> 
     <asp:ListItem>Electricals</asp:ListItem> 
     <asp:ListItem>Civil</asp:ListItem> 
     <asp:ListItem>Mechanical</asp:ListItem> 
    </asp:CheckBoxList> 
+0

op意思是asp.net核心 –

0

下面是如何使用ASP.NET MVC和ASP.NET核心

型号复选框一个完整的例子:

public class Student 
    { 
     public Student() 
     { 
      Courses = new HashSet<Course>(); 
     } 
     [Key] 
     public int Id { get; set; } 

     [Required] 
     [Display(Name = "Student Name")] 
     public string Name { get; set; } 

     public virtual ICollection<Course> Courses { get; set; } 
    } 

public class Course 
    { 
     public Course() 
     { 
      Students = new HashSet<Student>(); 
     } 
     [Key] 
     public int Id { get; set; } 

     [Required] 
     [Display(Name = "Course Name")] 
     public string Name { get; set; } 
     public virtual ICollection<Student> Students { get; set; } 

    } 

控制器:

public class StudentsController : Controller 
      { 
       private readonly CheckBoxListDbConetxt _dbConetxt = new CheckBoxListDbConetxt(); 


     [HttpGet] 
     public IActionResult CreateStudent() 
       { 

        ViewBag.AllCourses = _dbConetxt.Courses.ToList(); 
        return View(); 
       } 

       // POST: Students/Create 
       [HttpPost] 
       [ValidateAntiForgeryToken] 
       public IActionResult CreateStudent(Student student, List<int> selectedCourses) 
       { 
        if (ModelState.IsValid) 
        { 
         if (selectedCourses != null) 
         { 
          foreach (var item in selectedCourses) 
          { 
           Course course = _dbConetxt.Courses.Find(item); 
           student.Courses.Add(course); 
          } 
         } 

         _dbConetxt.Students.Add(student); 
         _dbConetxt.SaveChanges(); 
         return RedirectToAction("Index"); 
        } 

        ViewBag.AllCourses = _dbConetxt.Courses.ToList(); 
        return View(student); 
       } 
} 

在View:

<div class="form-group"> 
      <div class="col-md-2 input-label"> 
       <label class="control-label">Course</label> 
      </div> 

      <div class="col-md-10 input-box"> 
       <div class="form-control"> 
        @{ 
         var count = Enumerable.Count(ViewBag.AllCourses); 
         foreach (var item in ViewBag.AllCourses) 
         { 
          <input type="checkbox" name="selectedCourses" value="@item.Id" /> 
          @item.Name 
          if (--count > 0) 
          { 
           @:| 
         } 
         } 
        } 

</div> 
0

为了让浏览器渲染你需要类型复选框的元素复选框:

<input id="checkBox" name="checkbox" type="checkbox"> 

要创建的复选框项目的清单,你只需渲染这些元素的多个。

Asp.net核心通过允许您使用剃刀语法表达循环来简化此操作。您可以将以下内容放入cshtml文件中以呈现例如10复选框项目:

@for (int i = 0; i < 10; i++) 
{ 
     <input type="checkbox" /> 
     <br /> 
} 

最后,您可以使用Asp.net标签助手来进一步简化所需html的创建。

该示例假定您有一个名为Student的模型,该模型具有属性IsEnrolled。

@model Student 

@for (int i = 0; i < 10; i++) 
{ 
     <input asp-for="IsEnrolled" /> 
     <br /> 
} 

由于使用输入标签助手(asp-for),呈现给浏览器的html自动包含id和名称HTML属性。更重要的是,标签助手通过评估IsEnrolled属性的基础数据类型来自动设置type =复选框。