Question

我在模型类中创建了4列作为布尔类型，所以我想在cshtml页面中显示它们的值（如果在db列a中为true，那么该列属性在ui中设置为标记）在表中（D B）。我想显示多行，每行包含4个复选框，我需要互相排除每一行。如下图所示：

![enter image description here][1]


  [1]: http://i.stack.imgur.com/A2cl0.png

以下是model和cshtml的代码。感谢任何人的帮助

namespace Cerebro.ViewModels
{
    public class AttendanceViewModel
    {
        public AttendanceViewModel()
        {
            //this.Attendances = new [] List<Attendance>();
            this.Students = new List<StudentList>();
        }
        private StudentContext db = new StudentContext();
        public DateTime currentdate { get; set; }
        public DateTime weekStartDate { get; set; }
        public virtual List<StudentList> Students { get; set; }
        public virtual List<Attendance> [] Attendances { get; set; }


    }
}

    public partial class Attendance
    {
        public int AttendanceID { get; set; }
        public int StudentID { get; set; }
        public string StudentName { get; set; }
        public int ProviderID { get; set; }
        public int CourseID { get; set; }
        public int InstitutionID { get; set; }
        public int BatchID { get; set; }
        public string Teacher { get; set; }
        public Nullable<System.DateTime> AttendanceDate { get; set; }
        public bool Present { get; set; }
        public bool Leave { get; set; }
        public bool Absent { get; set; } 
        public bool Holiday { get; set; }
        public bool Status { get; set; } 
        public virtual StudentList StudentList { get; set; }

    }


@model Cerebro.ViewModels.AttendanceViewModel
@using Cerebro.ViewModels;

@{
    ViewBag.Title = "StudentAttendance";
}


@using (Html.BeginForm("Index","Attendance", FormMethod.Post))
{ 
    <p style="font-weight:bold; font-size:medium;color:Red">
    @TempData["errorMessage"].ToString() 
    </p>
    <fieldset>
        <legend>Attendance</legend>

        <table style="border: 2px solid #000">
        <tr style="text-align:left">
        <th><b style="color:Blue" >@ViewData["coachName"].ToString() &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</b></th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
        <td>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type="submit" name="buttn" value="Weekly" /></td>
        </tr>
        <tr>        
        <th>Center: &nbsp&nbsp&nbsp&nbsp</th>
        <td>@Html.DropDownList("InstitutionID")</td>
        <th>Batch:</th>
        <td>@Html.DropDownList("BatchID")</td>
        <th>Date:</th>
        <td>@Html.EditorFor(Model => Model.currentdate)</td>
        </tr>
        <tr>
        <th>Total:&nbsp @ViewData["Total"]</th>
        <th>Present:&nbsp @ViewData["Present"]</th>
        <th>Leave:&nbsp @ViewData["Leave"]</th>
        <th>Absent:&nbsp @ViewData["Absent"] &nbsp&nbsp&nbsp&nbsp</th>

         <th><input type="submit" name="buttn" value="Save" /></th>

        <th><input type="submit" name="buttn" value="Submit" />&nbsp&nbsp&nbsp&nbsp</th>

        </tr>
        @*<tr>
        <th>&nbsp</th><th>&nbsp</th><th>&nbsp</th><th>&nbsp</th><th>&nbsp</th><th>&nbsp</th>
        </tr>*@
        </table>
        <table>
        <thead>

        <tr style="background-color:InfoText; text-align:left">
        <th style="color:Orange">Student Name &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp </th>
        <th style="color:Orange">Board </th>
        <th style="color:Orange">Class</th>
        <th></th>

        <th style="color:Orange; padding-left:10">Present &nbsp&nbsp </th> 
        <th style="color:Orange; padding-left:10">Leave &nbsp&nbsp </th> 
        <th style="color:Orange; padding-left:10">Absent &nbsp&nbsp </th> 
        <th style="color:Orange; padding-left:10">Holiday &nbsp&nbsp </th>  
        </tr>
        </thead>

        @for (int i = 0; i < Model.Attendances.Length; i++)
        {
            if (Model.Attendances[i].Count != 0)
            {
                int j = 0;
            <tr>
                <td>
                    @Model.Attendances[i][0].StudentName
                </td>
                <td>@Model.Attendances[i][0].StudentList.CourseList.ProviderList.ProviderName</td>
                <td>@Model.Attendances[i][0].StudentList.CourseList.CourseName</td>
                <td></td>


                <td>&nbsp<input type="checkbox" id="Present" name="@i"  checked ="@Model.Attendances[i][0].Present" value="@Model.Attendances[i][0].Present"   /> &nbsp&nbsp&nbsp</td>
                 <td>&nbsp<input type="checkbox" id="Leave" name="@i" checked ="@Model.Attendances[i][0].Leave" value="@Model.Attendances[i][0].Leave" /> &nbsp&nbsp&nbsp</td>
                 <td>&nbsp<input type="checkbox" id="Absent" name="@i" checked ="@Model.Attendances[i][0].Absent" value="@Model.Attendances[i][0].Absent" /> &nbsp&nbsp&nbsp</td>
                <td>&nbsp <input type="checkbox" id="Holiday" name="@i" checked ="@Model.Attendances[i][0].Holiday" value="@Model.Attendances[i][0].Holiday"  /> &nbsp&nbsp&nbsp</td>


                  <td>@Html.ActionLink("ChapterTestUI", "Index", "Leaves", new { sid = @Model.Attendances[i][0].StudentID }, new { @class = "chapterTest", Title = "View chapter test" })</td>

                @Html.HiddenFor(model => model.Attendances[i][0].Status)
                @Html.HiddenFor(model => model.Attendances[i][0].AttendanceDate)
                @Html.HiddenFor(model => model.Attendances[i][0].StudentID)
                @Html.HiddenFor(model => model.Attendances[i][0].StudentName)
                @Html.HiddenFor(model => model.Attendances[i][0].ProviderID)
                @Html.HiddenFor(model => model.Attendances[i][0].CourseID)
                @Html.HiddenFor(model => model.Attendances[i][0].BatchID)
                @Html.HiddenFor(model => model.Attendances[i][0].InstitutionID)
                @Html.HiddenFor(model => model.Attendances[i][0].AttendanceID)


            </tr>

            }
        }         
        </table>

    </fieldset> 
}
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")

     @Scripts.Render("~/bundles/jqueryui")
    @Styles.Render("~/Content/themes/base/css")

    <script type="text/javascript">
        $(document).ready(function () {

                function MutExChkList(chk)
                {
                    var chkList = chk.parentNode.parentNode.parentNode;
                    var chks = chk.getElementsByTagName("0");
                    for(var i=0;i<chks.length;i++)
                    {
                        if(chks[i] != chk && chk.checked)
                        {
                            chks[i].checked=false;
                        }
                    }
                }


            var serverDate = '@ViewBag.ServerDate';

            $("#currentdate").datepicker({
                showButtonPanel: true,
                buttonImage: "/images/datepicker.png",
                changeMonth: true,
                changeYear: true,
                showOn: "focus",
                yearRange: '1900:2100',
                minDate: new Date(1900, 1 - 1, 1),
                maxDate: '+100Y',
                dateFormat: 'dd-M-yy',
                inline: true
            }).datepicker("setDate", serverDate);


            $("#InstitutionID").change(function () {
                var Institution = $(this).val();
                window.location.href = "../../Attendance/Index?InsId=" + Institution + "&batid=0&date="+serverDate;
            });

            $("#BatchID").change(function () {
                var Institution = $("#InstitutionID").val();
                var batchid = $(this).val();
                window.location.href = "../../Attendance/Index?InsId=" + Institution + "&batid=" + batchid + "&date="+serverDate;
            });

            $("#currentdate").change(function () {
                var Institution = $("#InstitutionID").val();
                var batchid = $("#BatchID").val();
                var date = $(this).val();
                window.location.href = "../../Attendance/Index?InsId=" + Institution + "&batid=" + batchid + "&date=" + date;
            });


        });


    </script>
}

Answer 1

试试这个，

这只是一个例子，

添加nueget Install-Package MvcCheckBoxList

<强>模型

public class City {
  public int Id { get; set; }           // Integer value of a checkbox
  public string Name { get; set; }      // String name of a checkbox
  public object Tags { get; set; }      // Object of html tags to be applied to checkbox, e.g.: 'new { tagName = "tagValue" }'
  public bool IsSelected { get; set; }  // Boolean value to select a checkbox on the list
}

public class CitiesViewModel {
  public IList<City> AvailableCities { get; set; }
  public IList<City> SelectedCities { get; set; }
  public PostedCities PostedCities { get; set; }
}

// Helper class to make posting back selected values easier
public class PostedCities {
  public string[] CityIDs { get; set; }
}

查看

@Html.CheckBoxListFor(x => x.PostedCities.CityIDs, // checkbox list name, 'PostedCities.CityIDs' in this case x => x.AvailableCities, // List<City>() x => x.Id, // City.Id x => x.Name, // City.Name x => x.SelectedCities) // List<City>() - should contain only cities to be selected

点击此处查看示例：MvcCheckBoxList

http://www.codeproject.com/Tips/613785/How-to-Use-CheckBoxListFor-With-ASP-NET-MVC-4

如何在cshtml页面中创建CheckBoxList

1 个答案: