1. 程式人生 > >MVC顯示錶格,點選列頭可以排序

MVC顯示錶格,點選列頭可以排序

前臺:

                        <table class="table table-bordered table-hover">
                            <thead>
                                <tr>
                                    <th>序號</th>
                                    <th style="max-width: 100px; vertical-align:middle;">章名稱</th>
                                    <th style="max-width: 150px;">節名稱</th>
                                    <th>思維導圖名稱</th>
                                    <th>學員名稱</th>
                                    <th>思維導圖檔案</th>
                                    <th>描述</th>
                                    @*<th>得分</th>*@
                                    <th>@Html.Partial("UndefinedPicSort", "sortCode", new ViewDataDictionary { { "ColumnName", "Score" },{"SortType",ViewData["SortType"]}, { "DisplayName", "得分" },{"TrainingId",ViewData["TrainingId"]},{"UnitContent",ViewData["UnitContent"]},{"ClassId",ViewData["ClassId"]},{"AccountId",ViewData["AccountId"]} })</th>
                                    <th>@Html.Partial("UndefinedPicSort", "sortCode", new ViewDataDictionary { { "ColumnName", "CreateDate" },{"SortType",ViewData["SortType"]}, { "DisplayName", "提交時間" },{"TrainingId",ViewData["TrainingId"]},{"UnitContent",ViewData["UnitContent"]},{"ClassId",ViewData["ClassId"]},{"AccountId",ViewData["AccountId"]} })</th>
                                    <th>是否是前三名</th>
                                    <th>評分</th>
                                </tr>
                            </thead>
                            <tbody>
                                @{
                                    var i = 1;
                                    string strAtt = string.Empty;
                                    //  章Id
                                    var chapterId = 0;
                                    var lastChapterId = 0;
                                    //  節Id
                                    var sectionId = string.Empty;
                                    var lastSectionId = string.Empty;
                                    foreach (CourseUndefinedPicInfe cupi in ViewBag.UndefinedPicList)
                                    {
                                        var accout = accountBll.GetModel(int.Parse(cupi.AuthorId), "");
                                        var baseInfo = baseBll.GetListModel(" Delflag=0 and AccountId=" + cupi.AuthorId);
                                        chapterId = cupi.Id;
                                        sectionId = string.IsNullOrEmpty(cupi.SecionId) ? "0" : cupi.SecionId;
                                        var spanChapter = ((List<CourseUndefinedPicInfe>)ViewBag.UndefinedPicList).FindAll(t => t.Id == cupi.Id).Count;
                                        var spanSection = ((List<CourseUndefinedPicInfe>)ViewBag.UndefinedPicList).FindAll(t => t.SecionId == cupi.SecionId).Count;
                                    <tr>
                                        <td class="contentMiddle">@i</td>
                                        @if (chapterId != lastChapterId)
                                        {
                                            <td id="
[email protected]
" rowspan="@spanChapter">@cupi.ChapterTitle</td> } @if (sectionId != lastSectionId) { <td id="[email protected]
" rowspan="@spanSection">@cupi.SecionTitle</td> } <td class="contentMiddle">@cupi.TaskTitle</td> <td class="contentMiddle"> @if (baseInfo.Count > 0) { @baseInfo.First().RealName } else { @accout.Nickname } </td> <td class="contentMiddle"> <div style="float: right; padding: 5px 0;" id="AttachNameList"> @if (!string.IsNullOrEmpty(@cupi.AttList)) { //解析Json JavaScriptSerializer jr = new JavaScriptSerializer(); var HomeWorkAtt = jr.Deserialize<List<Dianda.AP.Model.Course_UnitHomeWorkOther>>(@cupi.AttList); if (HomeWorkAtt != null && HomeWorkAtt.Count > 0) { foreach (var AttItem in HomeWorkAtt) { strAtt += "0," + AttItem.AttName + "," + AttItem.AttPath + ":"; <a href="
[email protected]
&[email protected]">@AttItem.AttName</a> <br /> } } } </div> </td> <td class="contentMiddle">@Html.Raw(cupi.HomeWorkContent)</td> <td class="contentMiddle">@cupi.Score</td> <td class="contentMiddle">@cupi.CreateTime</td> <td class="contentMiddle">@{if (cupi.IsTopThree == true) {<span>是</span>} else {<span>否</span>}}</td> <td class="contentMiddle"> @if (!string.IsNullOrEmpty(@cupi.AuthorId) && @cupi.AuthorId != ViewBag.AccountId) { <input type="text" style="width:50px;" id="@cupi.HId" /> <input type="button" onclick="submitScore(@cupi.HId)" value="確定" /> } </td> </tr> i++; lastChapterId = cupi.Id; lastSectionId = cupi.SecionId; } } </tbody> </table>

UndefinedPicSort:
@{
    //路由資料 如:Employee/Sortable?sortBy=EmployeeNO&ascending=False
    var routeData = new RouteValueDictionary {
    { "sortCode", ViewData["ColumnName"].ToString() }, 
    { "sortType", ViewData["SortType"].ToString() },
    {"trainingId",ViewData["TrainingId"].ToString()},
    {"unitContent",Dianda.Common.QueryString.Encrypt(ViewData["UnitContent"].ToString())},
    {"classId",ViewData["ClassId"].ToString()},
    {"accountId",Dianda.Common.QueryString.Encrypt(ViewData["AccountId"].ToString())},
    };


    var htmlAttributes = new Dictionary<string, object>();
    if (ViewData["SortType"].ToString() == "ASC")
    {
        htmlAttributes.Add("class", "sortAsc");//新增css樣式
    }
    else
    {
        htmlAttributes.Add("class", "sortDesc");
    }
 
    @Html.ActionLink(
    ViewData["DisplayName"].ToString(), // 連結文字 
    Html.ViewContext.RouteData.Values["action"].ToString(), // Action 
    Html.ViewContext.RouteData.Values["controller"].ToString(), // Controller 
    routeData, // 路由資料
    htmlAttributes //HTML屬性適用於超連結
    ) 
}