Question

我有一个要求，我必须根据下拉列表中选择的值对MVC中的HTML表进行排序。

下拉列表有2个值：按数字排序和按说明排序。以下是代码：

@{
    Layout = T4MVC.SharedController.ViewNames._Ctx;
}

@section brandcrambs{
    <div id="breadcrumbs">@{Html.RenderPartial(T4MVC.SharedController.ViewNames._ProductCatalogBrandCrambs, Model);}</div>
}
@Html.DropDownList("SortBy", new List<SelectListItem>
{
                    new SelectListItem{ Text="Sort By Number", Value="0", Selected=true},
                    new SelectListItem{ Text="Sort By Description", Value = "1" }
                 })
@{
    var s = @ViewData["currentNode"];
}
<div style="font-size: 14px; font-weight: bold">
    @Convert.ToString(s)
</div>

@foreach (SubSectionNodesVM n in Model.Nodes)
{
    <h4>

        @if (n.CurrentNode.Key.Contains("Specification"))
        {
            Html.RenderPartial(T4MVC.SharedController.ViewNames._PrintButtons, n.CurrentNode);
        }
    </h4>
        var matchValue = n.Nodes as IEnumerable<SiteMapNodeBase>;
        var resultSet = from dtRow in matchValue.AsEnumerable()
                        group dtRow by dtRow.Prefix into newGroup
                        orderby newGroup.Key
                        select newGroup;
        var datamodel = resultSet as IEnumerable<SiteMapNodeBase>;
        var k = 0;
    <div id="@n.CurrentNode.Key.Replace("Specification|", "").Replace("Section|", "")" >

        <table>


            @foreach (var item in resultSet)
            {
                k++;
                var match = item.Select(m => m.DefaultValue);

                string resultDefaultValue = string.Empty;

                if (match != null)
                {
                    if (match.Count() > 0)
                    {
                        resultDefaultValue = match.ToList()[0];
                    }
                }



                <tr style="background-color:@(k % 2 == 1 ? "white" : "rgb(246,246,246)")">
                    <td colspan="4" style="font-size: 12px; font-weight: bold">@resultDefaultValue</td>



                </tr>

                var i = 0;
                foreach (var inneritem in item)
                {
                    k++;  
                <tr style="background-color:@(k % 2 == 1 ? "white" : "rgb(246,246,246)")">
                    <td style="width: 250px"><a href="@HUtil.UrlPrefix@Url.SiteMapUrl(inneritem)">@inneritem.Number</a></td>
                    @if (@inneritem.RangeStart == null || @inneritem.RangeStart == "")
                    {
                        <td style="width: 250px"></td>
                    }
                    else
                    {
                        <td style="width: 250px">From: @inneritem.RangeStart</td>  
                    }
                    @if (@inneritem.RangeEnd == null || @inneritem.RangeEnd == "")
                    {
                        <td style="width: 250px"></td>
                    }
                    else
                    {
                        <td style="width: 250px">To: @inneritem.RangeEnd</td>
                    }
                    <td style="width: 800px">@inneritem.Description</td>
                </tr>
                }




            }

        </table>

<script>
    $(document).ready(function () {
        $('#SortBy').change(function () {
            var value = $("#SortBy option:selected").val();
            alert(value);
        });
    })

</script>

Answer 1

我强烈建议您阅读本文：

http://www.asp.net/mvc/tutorials/getting-started-with-ef-using-mvc/sorting-filtering-and-paging-with-the-entity-framework-in-an-asp-net-mvc-application

它将解释如何根据输入对Entity Framework中的数据进行排序（和过滤等）。该示例不使用Dropdown来演示这一点，但如果您了解该示例，则应该能够使用DropDown。

这是一种服务器端方法，在搜索，排序和分页时，我总是建议这样做。

如果您选择在客户端进行排序，则需要采用不同的方法。它有很多插件，您也可以使用纯javascript或jQuery

自己完成

客户端排序插件的示例：

如何根据下拉列表中选择的值对MVC中的HTML表进行排序

1 个答案: