Custom message inside the webgrid if empty

  @if (Model.ActivityCollection.Count > 0)
        {
      开发者_开发百科  var grid = new WebGrid(source: Model.ActivityCollection, rowsPerPage: 12, canSort: false);   
            @grid.GetHtml(tableStyle: "webGrid",
            headerStyle: "header",
            alternatingRowStyle: "alt",
            columns: grid.Columns(
            grid.Column("EffectiveDate", "Effective Date", style: "date"),
            grid.Column("PremiumPaymentAmount", "Premium Payment Amount", style: "amount"),
            grid.Column("PaymentType", "Payment Type", style: "date")
           ));
        }
else
        {

        }

I would like to display a message "No Payment Information Found" inside the web grid in the above else statement. Can someone help me with this?

---

<div class="grid" style="margin-left:5px;" id="grid">          
        @if (Model.ActivityCollection.Count > 0)
        {
            var grid = new WebGrid(source: Model.ActivityCollection, rowsPerPage: 12, canSort: false);   
            @grid.GetHtml(tableStyle: "webGrid",
            headerStyle: "header",
            alternatingRowStyle: "alt",
            columns: grid.Columns(
            grid.Column("EffectiveDate", "Effective Date", style: "date"),
            grid.Column("PremiumPaymentAmount", "Premium Payment Amount", style: "amount"),
            grid.Column("PaymentType", "Payment Type", style: "date")
           ));
        }
        else
        {
            <div class="grid">
            <table cellspacing="0" width="80%">
               <thead>
                    <tr>
                        <th>Effective Date</th>
                        <th>Premium Payment Amount</th>
                        <th>Payment Type</th>
                        </tr>
                </thead>
                <tbody>
                 <tr>
                        <td colspan="3" align="center" ><br />No payment information found<br /><br /> </td>
                 </tr>                     
                </tbody>
            </table>
            <br/><br/><br/><br/>
            </div>
        }
        </div>

---

I made this jQuery-function to be triggered when the grid has loaded, and if there is no data in the table it will insert a new row in the empty table to display the text. Much more manageable than building a replica of the WebGrid in HTML.

I added a row style to the Webgrid, to identify the rows (not wanting the header+footer): "webGridDataRow".

function addNoDataTextIfNeeded(){
    if($(".webGrid .webGridDataRow").length < 1){ //if there are no data-rows in table, our text should be displayed
        var newCell = $("<td>") //create the cell
            .attr("colspan", $(".webGrid tr:first th").length) //set colspan so it will span entire grid width (counting the number of column headers)
            .text("No data found"); //add the text to be displayed
        $("<tr>").append(newCell).appendTo(".webGrid"); //add the cell to a row to the grid :)
    }
}

---

you can do something like this?

public class MyWebGrid : WebGrid
{
    public WebGridMkf(IEnumerable<dynamic> source = null,
        IEnumerable<string> columnNames = null,
        string defaultSort = null,
        int rowsPerPage = 10,
        bool canPage = true,
        bool canSort = true,
        string ajaxUpdateContainerId = null,
        string ajaxUpdateCallback = null,
        string fieldNamePrefix = null,
        string pageFieldName = null,
        string selectionFieldName = null,
        string sortFieldName = null,
        string sortDirectionFieldName = null) :
        base(source, columnNames, defaultSort, rowsPerPage, canPage, canSort, ajaxUpdateContainerId, ajaxUpdateCallback, fieldNamePrefix, pageFieldName, sortFieldName, sortDirectionFieldName)
    {
    }

    public IHtmlString Table(string tableStyle = null,
        string headerStyle = null,
        string footerStyle = null,
        string rowStyle = null,
        string alternatingRowStyle = null,
        string selectedRowStyle = null,
        string caption = null,
        bool displayHeader = true,
        bool fillEmptyRows = false,
        string emptyRowCellValue = null,
        IEnumerable<WebGridColumn> columns = null,
        IEnumerable<string> exclusions = null,
        Func<dynamic, object> footer = null,
        object htmlAttributes = null)
    {
        if (this.TotalRowCount.Equals(0))
        {
            return new HtmlString("<div>teste</div>");
        }

        return base.Table(tableStyle, headerStyle, footerStyle, rowStyle, alternatingRowStyle, selectedRowStyle, caption, displayHeader, fillEmptyRows, emptyRowCellValue, columns, exclusions, footer, htmlAttributes);
    }
}

and call:

var grid = new MyWebGrid(
        ajaxUpdateContainerId: "grid-test",
        rowsPerPage: 10,
        defaultSort: "id"
    );
    grid.Bind(
        source: Model.ActivityCollection,
        rowCount: Model.ActivityCollection.Count
    );
@grid.Table(
alternatingRowStyle: "color1",
rowStyle: "color0",
tableStyle: "webgrid table table-striped table-hover table-condensed",
headerStyle: "webgrid-header",
footerStyle: "webgrid-footer",
footer: @<span></span>,
columns: grid.Columns(
    grid.Column(columnName: "id",
                header: "ID",
                style: "column-id",
                canSort: true)
    )
)