how do I create a custom WebGrid Column

问题:

i need to add an additional column to my WebGrid, the new colume should contain an HTML5 audio based on one of the record's fields. something like that:

    <audio controls="controls">
        <source src="@string.Format("{0}{1}", @item.SongID.ToString(), ".mp3")" type="audio/mp3"/>
        Your browser does not support the audio element.
    </audio>

does webgrid supports such a scenario?

Thank! ofer

回答1:

Here's one way of doing it. Inside your view create a helper and use it for column format:

@helper AudioTag(dynamic item)
{
    <audio controls="controls">
        <source src="@string.Format("{0}.mp3", item.SongID)" type="audio/mp3"/>
        Your browser does not support the audio element.
    </audio>
}

<div>
    @grid.GetHtml(columns: grid.Columns(
                                grid.Column("Audio", format: a => AudioTag(a))));
</div>