Question

我已经读过this post，它触发了模态，但效果不完全。

我只看到灰色的窗口，但看不到模态。

我的HTML：

 <div id='gameModal' class='modal hide fade in' data-url='@Url.Action("TermsAndConditions","Base")'>
 <div id='gameContainer'/>
 <button id='showGame'>Show Game Listing</button></div>

在我的js中：

 $('#showGame').click(function () {
    var url = $('#gameModal').data('url');

    $.get(url, function (data) {
        $('#gameContainer').html(data);

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

我还创建了一个带有partialView的控制器：

 [HttpGet]
 public ActionResult TermsAndConditions()
  {
     return PartialView();
  }

我发现我的js文件中的行被跳过了：$ .get（url，function（data）可能是因为我的路由配置中有其他参数。

我使用的不是“ / Base / TermsAndConditions”这样的“常规”路由 “ / en-US / Base / TermsAndConditions” 是否有任何提示如何在不分割url和mambo-jumbo的情况下不设置附加参数的情况下设置url？

这是我的路由配置：

 public class RouteConfig
 {
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            name: "Default",
            url: "{language}/{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional, language = "en-US" }
        );
    }
}

是否有更现代的方法可以打开partialViews的模态？更新：我设法查看了我的模式，但前提是我将局部视图HTML代码放在我的示例布局页面中的按钮旁边，如下所示：

<button class="btn btn-primary" data-toggle="modal" data-url='@Url.Action("TaC","Home")' data-target=".bs-example-modal-lg">Large modal</button>
 <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
  <div class="modal-body">
     <div class="modal-content">
       <div class="modal-header">
         <h4 class="modal-title" id="myModalLabel">Modal Heading</h4>
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        </div>
<div class="modal-body">
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. 
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>                        
        </div>
      </div>
    </div>
  </div>
</div>

如果我将data-url=@Url.Action（“ Index”，“ Home”）放到控制器上。

Bootstrap 4和MVC5作为部分视图打开模式

0 个答案: