使用JQuery来填充一个MVC4 partialview的模态弹出框

Question

这使我疯狂。我在解决此问题方面遇到问题。该对话框打开，但partialview未加载。我在这里尝试过很多例子，但无济于事。这是迄今为止我所拥有的。

我_layout.cshtml文件有以下几点：

<div id="modal-content" name="modal-content"></div> 

在我site.js我有以下几点：

$('#modal-content').dialog({ 
    autoOpen: false, 
    position: { my: 'center', at: 'top+350', of: window }, 
    width: 'auto', 
    height: 'auto', 
    fluid: true, 
    modal: true, 
    resizable: false, 
    title: 'Create Guestbook Post', 
    open: function(event, ui) { 
     $(this).load('@Url.Action("_Create")'); 
    }, 
}); 

$('#buttonCreateGuestbookPost').click(function() { 
    $('#modal-content').dialog('open'); 
}); 

在partialview（_Create.cshtml）我有以下几点：

@model MPP.Database.Guestbook 
@using (Html.BeginForm()) 
{ 
    <div class="row"> 
     <h2>Create Account</h2> 
     @Html.AntiForgeryToken() 
     @Html.ValidationSummary(true) 

     <p> 
      @Html.LabelFor(model => model.FirstName, htmlAttributes: new { @class = "control-label float-left" }) 
      @Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger float-right" }) 
      @Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { @class = "form-control" } }) 
     </p> 
     <p> 
      @Html.LabelFor(model => model.LastName, htmlAttributes: new { @class = "control-label float-left" }) 
      @Html.EditorFor(model => model.LastName, new { htmlAttributes = new { @class = "form-control float-right" } }) 
      @Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" }) 
     </p> 
     <p> 
      @Html.LabelFor(model => model.EmailAddress, htmlAttributes: new { @class = "control-label float-left" }) 
      @Html.EditorFor(model => model.EmailAddress, new { htmlAttributes = new { @class = "form-control float-right" } }) 
      @Html.ValidationMessageFor(model => model.EmailAddress, "", new { @class = "text-danger" }) 
     </p> 
     <p> 
      @Html.LabelFor(model => model.Body, htmlAttributes: new { @class = "control-label float-left" }) 
      @Html.EditorFor(model => model.Body, new { htmlAttributes = new { @class = "form-control float-right" } }) 
      @Html.ValidationMessageFor(model => model.Body, "", new { @class = "text-danger" }) 
     </p> 
     <p> 
      <input type="submit" id="buttonCreateGuestbook" name="buttonCreateGuestbook" class="btn btn-primary" value="Create" /> 
     </p> 
     } 
    </div> 
} 

在我希望弹出窗口显示的视图中，我有以下按钮：

<a href="javascript:void(0);" class="btn btn-xs btn-success" id="buttonCreateGuestbookPost" style="margin-bottom:3px;">Post to Guestbook</a> 

当guestbook页面加载时，所有组件加载正常（按钮打开对话框，模式内容DIV，javascript打开/加载对话框等）。问题是，单击按钮时，模式对话框打开，但partialview未加载。

任何帮助将不胜感激。谢谢。

Answer 1

它说代码是在site.js，但你在那里使用的Razor代码的URL。

JS文件是静态的，不会被Razor编译。无论是对网址进行硬编码还是将其作为变量传递到您的视图中，以便您的脚本可以访问该变量。