如何在对表中的数据进行排序时,将glyphicon glyphicon - 按字母排序更改为glyphicon glyphicon-sort-by-alphabet-alt

时间:2017-11-13 01:42:51

标签: asp.net-mvc twitter-bootstrap

我想点击glyphicon glyphicon-sort-by-alphabet进行排序时将glyphicon glyphicon-sort-by-alphabet-alt更改为First Name,反之亦然。顺便说一句,我的排序工作正常。请指导我。如何使用它。

我的分类代码:

public ActionResult Index(string sortOrder,string currentFilter)
        {
            TestHandle testHandle = new TestHandle();
             ViewBag.CurrentSort = sortOrder;
            ViewBag.FNameSortParam = string.IsNullOrEmpty(sortOrder) ? "fname_desc" : "";

            var users = from s in testHandle.GetAll()
                        select s;

            switch (sortOrder)
            {
                case "fname_desc":
                    users=users.OrderByDescending(s => s.FName);
                    break;

                default: 
                    users = users.OrderBy(s => s.FName);

                    break;
            }

            return View(users);

        }

这是观点:

<table class="table">
    <tr>

        <th >
            @Html.ActionLink("First Name", "Index", new { sortOrder = ViewBag.FNameSortParam, currentFilter = ViewBag.CurrentFilter })
            <i class="glyphicon glyphicon-sort-by-alphabet"></i> 
        </th>

</table>

请指导我。我被困在这里。提前谢谢。

1 个答案:

答案 0 :(得分:1)

您的ViewBag.CurrentSort存储当前的排序顺序。您可以根据其值有条件地呈现css类。

当结果按降序排序时,

ViewBag.CurrentSort将具有值“fname_desc”,否则将具有空字符串值(对于升序结果)

<i class="glyphicon @(ViewBag.CurrentSort=="fname_desc"
                  ?"glyphicon-sort-by-alphabet-alt":"glyphicon-sort-by-alphabet")"></i>

您始终可以呈现glyphicon-sort-by-alphabet并有条件地将-alt部分字符串添加到其中以使其glyphicon-sort-by-alphabet-alt

<i class="glyphicon 
          glyphicon-sort-by-alphabet@(ViewBag.CurrentSort=="fname_desc"?"-alt":"")"></i>