1

Razor(ASP.Net MVC 4)を使用して以下を出力するための最良/最も簡単な方法を探しています

         <ul id="contacts">
            <li data-group="a">
                <a class="title">A</a>
                <ul>
                    <li>
                        <a href="#">
                            <span class="thumbnail">
                                <img alt="" src="~/backendContent/sample/p4.jpg"></span> Adam Woodward
                                                            <span style="font-size: 11px; display: block;" class="muted">Creative Director</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="thumbnail">
                                <img alt="" src="~/backendContent/sample/p5.jpg"></span> Aileen Espinoza
                                                            <span style="font-size: 11px; display: block;" class="muted">Creative Director</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="thumbnail">
                                <img alt="" src="~/backendContent/sample/p6.jpg"></span> Aimee Foley
                                                            <span style="font-size: 11px; display: block;" class="muted">Creative Director</span>
                        </a>
                    </li>
                </ul>
            </li>
            <li data-group="b">
                <a class="title">B</a>
                <ul>
                    <li>
                        <a href="#">
                            <span class="thumbnail">
                                <img alt="" src="~/backendContent/sample/p1.jpg"></span> Baker Terry
                                                            <span style="font-size: 11px; display: block;" class="muted">Creative Director</span>
                        </a>
                    </li>                        
                </ul>
            </li>
            <li data-group="c">
                <a class="title">C</a>
                <ul>
                    <li>
                        <a href="#">
                            <span class="thumbnail">
                                <img alt="" src="~/backendContent/sample/p1.jpg"></span> Cadman Mosley
                                                            <span style="font-size: 11px; display: block;" class="muted">Creative Director</span>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <span class="thumbnail">
                                <img alt="" src="~/backendContent/sample/p2.jpg"></span> Cailin Jones
                                                            <span style="font-size: 11px; display: block;" class="muted">Creative Director</span>
                        </a>
                    </li>                        
                </ul>
            </li>
            .
            .
            .

素敵な電話帳にフォーマットされる連絡先リストを見ることができます。私は現在、すべての情報をアルファベット順に保持するiqueryableを持っています。正直なところ、上記のhtmlを構成するためにかみそりを使用する方法がわかりませんでした。linqでグループ関数を使用することを考え、次のlinq式を思いつきました。

        var _customers = (from c in _db.UserProfiles.Include("ParentCompanies").Include("cProfile")
                          where (c.ParentCompanies.Any(pc => pc.CompanyUsers.Any(cu => cu.UserName == userName)) && c.cProfile != null)
                         group c by c.FirstName.Substring(0, 1) into customerGroup
                         select new { FirstLetter = customerGroup.Key, Information = customerGroup }).OrderBy(letter=>letter.FirstLetter);

しかし、メソッドの戻り型(匿名型)でいくつかの問題に遭遇し、それをどのように処理するかがわかりませんでした。私は今、以下を使用しています:

        var _customers = (from c in _db.UserProfiles.Include("ParentCompanies").Include("cProfile")
                          where (c.ParentCompanies.Any(pc => pc.CompanyUsers.Any(cu => cu.UserName == userName)) && c.cProfile != null)
                          select c).OrderBy(f=>f.FirstName);

私はasp.netMVCの世界に非常に慣れていないので、助けていただければ幸いです。

4

1 に答える 1

1

クエリのカスタムリターンタイプを宣言し、それをビューモデルとして使用できます。

public class GroupedCustomersViewModel
{
    string FirstLetter { get; set; }
    IEnumerable<UserProfile> Information { get; set; }
}

....

var _customers = 
    (from c in _db.UserProfiles.Include("ParentCompanies").Include("cProfile")
     where (c.ParentCompanies.Any(pc => pc.CompanyUsers.Any(cu => cu.UserName == userName)) && c.cProfile != null)
     group c by c.FirstName.Substring(0, 1).ToUpper() into customerGroup
     select new GroupedCustomersViewModel
     {
         FirstLetter = customerGroup.Key, 
         Information = customerGroup 
     })
    .OrderBy(letter=>letter.FirstLetter);

あなたの.cshtml使用で

@model IEnumerable<MyProject.Namespace.Models.GroupedCustomersViewModel>

...

<ul id="contacts">
    @foreach(var group in Model)
    {
    <li data-group="@group.FirstLetter.ToLower()">
        <a class="title">@group.FirstLetter</a>
        <ul>
            @foreach(var user in group.Information)
            {
            <li>
                <a href="#">
                    <span class="thumbnail">
                        <img alt="" src="@user.Thumbnail"></span> @user.Name
                                                    <span style="font-size: 11px; display: block;" class="muted">@user.Title</span>
                </a>
            </li>
            }
        </ul>
    </li>
    }
</ul>
于 2013-03-26T05:00:00.757 に答える