在Bootstrap的Modal form里面添加PartialView

   @using (Html.BeginForm("DisplaySites", "DisplayDSP", FormMethod.Post))
        {
                @(Html.Kendo().Grid(Model.SiteList) // Bind the grid to the Model property of the view
                                  .Name("SitesGrid")
                                  .Columns(columns =>
                                  {
                                      columns.Bound(s => s.Selected)
                                                   .Title("Aktivan")
                                                   .ClientTemplate("<input type='checkbox' #= Selected ? checked='checked': '' #  />")
                                                   .HtmlAttributes(new { style = "text-align: center" });

                                      columns.Bound(s => s.SiteId);   //Create a column bound to the "ProductID" property
                                      columns.Bound(s => s.SiteName); //Create a column bound to the "ProductName" property
                                  })
                                .Sortable(sortable => sortable
                                    .AllowUnsort(true)
                                    .SortMode(GridSortMode.MultipleColumn)
                                    )
                                 .Filterable()
                                 .Scrollable()
                                 .DataSource(ds =>ds
                                    .Ajax()
                                    .Model(m =>
                                    {
                                        m.Id(s => s.SiteId);
                                    }
                                    )
                                    .ServerOperation(false)
                                    )

            @*@(Html.Kendo().Grid(Model.SiteList) // Bind the grid to the Model property of the view
                                  .Name("Grid")
                                  .Columns(columns =>
                                  {
                                      columns.Bound(s => s.SiteId);   //Create a column bound to the "ProductID" property
                                      columns.Bound(s => s.SiteName); //Create a column bound to the "ProductName" property
                                  })
                                .Sortable(sortable => sortable
                                    .AllowUnsort(true)
                                    .SortMode(GridSortMode.MultipleColumn)
                                    )
                                 .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                                 .Scrollable()
                                 .DataSource (d=>d
                                 .Ajax()
                                 .Read(read => read.Action ("DisplaySites", "DisplayDSP"))
                                 .Model(m=> m.Id (s=>s.SiteId ))
                                 )*@

            )
        }

    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" id="savechange" class="btn btn-primary">Save changes</button>
    </div>

一般的Bootstrap Modal form是这样的

    @*<!-- Modal -->
    <div id="myModal" class="modal fade" role="dialog">
        <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">×</button>
                    <h4 class="modal-title">Modal Header</h4>
                </div>
                <div class="modal-body">
                    <p>Some text in the modal.</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>

        </div>

这个思想就是在Main View标记div id,然后用ajax调用controller的函数，把生成的Partial view放到gamecontainer内部，然后显示出来

在Main view 里面的代码

    <div id='gameModal' role="dialog" class='modal  fade' data-url='@Url.Action("DisplaySites", "DisplayDSP")'>
        <div class="modal-dialog">
            <div id='gameContainer' class="modal-content">
            </div>
        </div>

在Main view里面的javascript

            function displaysite()
            {
                // alert("hello world");
                var url = $('#gameModal').data('url');
                


                $.ajax({
                    url: url,
                    cache: false,
                    success: function (data) {
                        //alert(data);
                        $('#gameContainer').html(data);
                        $("#gameModal").modal('show');

                    }
                });
                return false;
            }

Partial view

   @using (Html.BeginForm("DisplaySites", "DisplayDSP", FormMethod.Post))
        {
                @(Html.Kendo().Grid(Model.SiteList) // Bind the grid to the Model property of the view
                                  .Name("SitesGrid")
                                  .Columns(columns =>
                                  {
                                      columns.Bound(s => s.Selected)
                                                   .Title("Aktivan")
                                                   .ClientTemplate("<input type='checkbox' #= Selected ? checked='checked': '' #  />")
                                                   .HtmlAttributes(new { style = "text-align: center" });

                                      columns.Bound(s => s.SiteId);   //Create a column bound to the "ProductID" property
                                      columns.Bound(s => s.SiteName); //Create a column bound to the "ProductName" property
                                  })
                                .Sortable(sortable => sortable
                                    .AllowUnsort(true)
                                    .SortMode(GridSortMode.MultipleColumn)
                                    )
                                 .Filterable()
                                 .Scrollable()
                                 .DataSource(ds =>ds
                                    .Ajax()
                                    .Model(m =>
                                    {
                                        m.Id(s => s.SiteId);
                                    }
                                    )
                                    .ServerOperation(false)
                                    )

            )
        }

    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" id="savechange" class="btn btn-primary">Save changes</button>
    </div>