RenderPartial not rendering inside of div

Question

Hi I'm having some issues understanding how MVC 3 and razor work. Basically, I have a view that's rendered with Html.Render partial. basically, I'm trying to render the contents or a partial view inside of div like so.

<div id="mydiv.id">
@{Html.RenderPartial("_BankAccountGrid", Model.CheckAccounts);}
</div>


@if (Model.Any())
{        

        @{Html.Grid(Model).Columns(c =>
        {
                c.For(a => Html.ActionLink(
                    "Edit",
                    "EditBankAccountDetails",
                    "UserManagement",
                    new { Id = a.Id }, new { id = "modalEdit" }));
                c.For(a => a.AccountName);
                c.For(a => a.AccountNumber);
                c.For(a => a.RoutingNumber);
                c.For(a => a.BankName);
                c.For(a => a.CheckAccountType);
                c.For(a => a.AccountType_Id).Visible(false);
                c.For(a => a.version).Visible(false);
                c.For(a => a.IsDefault).Visible(false);
                c.For(a => a.User_Id).Visible(false);
                c.For(a => a.Id).Visible(false);
            }).Render();
        }      
}

However when I look at the DOM in firebug the Table is ALWAYS rendered outside of the div in just a table element. I've tried this as well.

@{Html.RenderPartial("_BankAccountGrid", Model.CheckAccounts);}


@if (Model.Any())
{        
    <div id="accounts.grid.div">
        @{Html.Grid(Model).Columns(c =>
        {
                c.For(a => Html.ActionLink(
                    "Edit",
                    "EditBankAccountDetails",
                    "UserManagement",
                    new { Id = a.Id }, new { id = "modalEdit" }));
                c.For(a => a.AccountName);
                c.For(a => a.AccountNumber);
                c.For(a => a.RoutingNumber);
                c.For(a => a.BankName);
                c.For(a => a.CheckAccountType);
                c.For(a => a.AccountType_Id).Visible(false);
                c.For(a => a.version).Visible(false);
                c.For(a => a.IsDefault).Visible(false);
                c.For(a => a.User_Id).Visible(false);
                c.For(a => a.Id).Visible(false);
            }).Render();
        }
    </div>
}

.. but to no avail. Is there something I'm missing?

If I'm not clear enough or you just need more info please just ask instead of voting down.

Answer 1

You seem to be using MvcContrib.Grid. You should have mentioned that in your question. First make sure that you have downloaded the latest version (the one made for ASP.NET MVC 3, because the older version for ASP.NET MVC 2 doesn't work well with Razor).

Then try like this:

@if (Model.Any())
{        
    @(Html
        .Grid(Model)
        .Columns(c =>
        {
            c.Custom(
                @<text>
                    @Html.ActionLink(
                        "Edit", 
                        "EditBankAccountDetails", 
                        "UserManagement", 
                        new { Id = item.Id }, 
                        new { id = "modalEdit" }
                    )
                 </text>
            ).Named("");

            c.For(a => a.AccountName);
            c.For(a => a.AccountNumber);
            c.For(a => a.RoutingNumber);
            c.For(a => a.BankName);
            c.For(a => a.CheckAccountType);
            c.For(a => a.AccountType_Id).Visible(false);
            c.For(a => a.version).Visible(false);
            c.For(a => a.IsDefault).Visible(false);
            c.For(a => a.User_Id).Visible(false);
            c.For(a => a.Id).Visible(false);
        })
     )
}

Notice that I am using a Custom column for the ActionLink and that I am no longer calling the .Render method on the grid.

Answer 2

Html.RenderPartial writes directly to the response. I think what you want here is Html.Partial.

<div id="mydiv.id">
@Html.Partial("_BankAccountGrid", Model.CheckAccounts)
<div>

See this question for more detail