So rufen Sie eine bootstrap-modal dialog auf Anker klicken Sie mit parameter

gewusst wie: aufrufen eine Teilansicht im bootstrap modal dialog in mvc mit parameter-details-Seite. modal ist, nicht die öffnung mit meinem code irgendeinen Vorschlag, was ist falsch mit ihm. und eine weitere dünne ich vergaß zu erwähnen, ich bin immer

500 (Internal Server Error)

in meiner Konsole.
hier ist mein code.

Teilansicht

@model Flight.ViewModels.ViewTeamList
<div class="modal-body">
        <div class="row">
            <div class="col-md-4 col-sm-4">
                @Html.CustomLabel("lblTeam", " Team Name:")
            </div>
            <div class="col-md-8 col-sm-8">
                @Model.TeamDetails.TeamName
            </div>
        </div>
        <div class="row">
            <div class="col-md-4 col-sm-4">
                @Html.CustomLabel("lblCTUserCount", "User Count")
            </div>

            <div class="col-md-8 col-sm-8 pull-left">
                @Model.TeamDetails.UserCount
            </div>

        </div>
    </div>

webgrid in einer Ansicht, in der ich den Anker-Tags auf, die klicken Sie auf ich habe zum öffnen des modalen.

@model Flight.ViewModels.ViewTeamList

<script type="text/javascript"> 
    var TeamDetailPostBack = '@Url.Action("Details", "Team", new { area = "CTAdmin" })'
</script>
@using (Html.BeginForm("Index", "Team", FormMethod.Post))
{
    <div class="row">
        <div class="col-md-12 col-sm-12">
            @*  For Count *@
            @{ var teamList = Model.TeamList.ToList(); }
            @if (teamList.Count() > 0)
            {
                <div class="table-responsive">
                    @{
                var grid = new WebGrid(source: teamList.ToList(), defaultSort: "TeamName", canPage: true, rowsPerPage: 10);
                    }
                    @grid.WebGridSelectAll(

                    headerStyle: "gridHeader",
                    tableStyle: "table table-condensed table-striped table-bordered table-hover no-margin",
                    checkBoxValue: "TeamId",
                    columns: new[]{
                    grid.Column("TeamName",format: @<a href="#" class="detailstt" data-id="@item.TeamId">@item.TeamName</a>,header: Html.CustomText("lblCTTeamName", "Team Name")),

                    grid.Column("UserCount",format: @<a href="#" class="details" data-id="@item.TeamId">@item.UserCount</a>, header: Html.CustomText("lblCTUserCount", "# of User(s)"))
                    }
                      )
                </div>
            }
        </div>
    </div>
}
<div id='dialogDiv' class='modal hide fade in'>
    <div id='dialogContent'></div>
    </div>
 <script src="~/Scripts/[email protected]()"></script>

javascript-Datei mit dem Namen Team.js in dem ich den code zum öffnen
der dialog

$(document).ready(function () {
    $('a.detailstt').click(function () {
            var $buttonClicked = $(this);
            var id = $buttonClicked.attr('data-id');
            var newUrl = "/Team/Details?id=" + id;
            $.ajax({
                url: newUrl,
                type: "GET",  //these is must               
                cache: false,  //these is for IE
                contentType: "application/json; charset=utf-8",
                dataType: "json"
            }).done(function (data) {

            $('#dialogContent').modal('show');
        });
});

});