Question

I may be doing it wrong… so please correct me if i am.

I’ve pulled my Last.FM data from their RestAPI and cached it (to be refreshed only if the cache is greater than 30 minutes old), and from there i’ve loaded it into an enumerated list of tracks.

I’m attempting to drop that logic in the Razor display, and never managed to make it work with more than just the foreach and if (item.image…)…, adding in the logic to drop the divs has caused razor to loose track of the closing bracket for the foreach.

Am I making this too complicated?

       <!-- lfm data -->
            @* Iterate over the Last.FM data and display it in an attractive format *@
@foreach (var group in Model.Select((x, i) => new { Group = i / 4, Item = x })
                            .GroupBy(x => x.Group)) {
    <div class="LFM-Data">
    foreach(var x in group) {
        if (x.item.image != null) {
            <img src="@x.item.image.ToString()" class="lfm-artwork" alt="@x.item.album"/>
        } else {
            <img src="/Content/images/lfm/NoAlbumArt.jpg" class="lfm-artwork" alt="No Album Art Available" />
        }
        <p>@Html.Raw(x.item.name.ToString())</p>
    }
    </div>
 }

after following Equiso’s suggestion, i’m getting an odd scoping issue where either X is not in the current scope, or x does not contain a property for image…

@model IEnumerable<CCBlog.Classes.LastFmWrapper.Track>

and this is part of the LFM Wrapper class — that i’m modeling the data after

 public struct Track
        {
            public string artist { get; set; }
            public string name { get; set; }
            public string album { get; set; }
            public string image { get; set; }
        }

I call shenanigans!

Answer 1

If you are trying to display the items in groups of 4 you could do somethig like this

@foreach (var group in Model.Select((x, i) => new { Group = i / 4, Item = x })
                            .GroupBy(x => x.Group)) {
    <div class="LFM-Data">
    foreach(var x in group) {
        if (x.Item.image != null) {
            <img src="@x.Item.image.ToString()" class="lfm-artwork" alt="@x.Item.album"/>
        } else {
            <img src="/Content/images/lfm/NoAlbumArt.jpg" class="lfm-artwork" alt="No Album Art Available" />
        }
        <p>@Html.Raw(x.Item.name.ToString())</p>
    }
    </div>
 }

or you could create a ViewModel that get the items grouped already.