【问题标题】:Cannot render PartialView in modal popup (Kendo window)无法在模式弹出窗口中呈现 PartialView(剑道窗口)
【发布时间】:2015-05-28 13:44:49
【问题描述】:

在我的 MVC 应用程序中,我在单击“创建”按钮后打开了一个弹出窗口,但我无法在其中渲染我的局部视图渲染。我想要做的只是在弹出对话框中render partialview将模型和一些参数(即 id=1)传递给它。你能告诉我错误在哪里吗?提前致谢。

注意:任何使用 bootstrap modal 的解决方案也将不胜感激...

查看:

@(Html.Kendo().Window()
    .Name("CreateWindow")
    .Title("Create Employee")
    .Visible(false)
    .Draggable(true)
    .LoadContentFrom("_Create", "Employee")
    .Width(800)
    .Modal(true)
    .Content("Loading Part List Info...")
    .Draggable()
    .Resizable()
)


<script type='text/javascript'>
$(function () {
    // When your button is clicked
    $('#createbtn').click(function () {
        var createWindow = $('#CreateWindow').data('kendoWindow');
        createWindow.center().open();
    });
});
</script>


控制器:

[HttpGet]
public ActionResult _Create()
{
    var model = repository.Employee;
    return PartialView(model);
}


部分视图:

@model Employee

<div>MY PARTIAL VIEW CONTENT GOES HERE ...</div>


【问题讨论】:

  • 我已经尝试了您的代码,它对我来说运行良好。只是在视图末尾缺少封闭的&lt;/script&gt; 标签。
  • 其实我的项目中没有缺失的标签,我也在上面添加了缺失的标签。另一方面,对话框已打开,但部分视图的内容未呈现,模型数据无法检索到模态窗口。有什么想法吗?
  • 因为它似乎对我有用而不是对你有用,我认为问题一定出在其他地方。为了以防万一,您的导航器是否有一些潜在的相关 JavaScript 错误? (从你的例子来看,在我这边,我可以将模型数据传递给 PartialView 并将它们很好地显示到这个视图中)
  • 我不喜欢使用content 属性来请求部分内容。我在内容 div 上使用 jQuery 的 load() 方法,然后在加载内容后显示窗口。
  • @DontVoteMeDown 您能否通过对上面的代码进行必要的修改来发布您的示例代码?保证,我不会投反对票:)

标签: asp.net-mvc kendo-ui modal-dialog partial-views popupwindow


【解决方案1】:

这是我的工作代码,希望对您有所帮助:

查看:

@{ ViewBag.Title = "Test"; }
@Styles.Render("~/Content/kendoui/css")

<input type="button" id="createbtn" value="Test kWindow"/>

@(Html.Kendo().Window()
    .Name("CreateWindow")
    .Title("Create Employee")
    .Visible(false)
    .Draggable(true)
    .LoadContentFrom("_Create", "Employee", new { id = 1 })
    .Width(800)
    .Modal(true)
    .Content("Loading Part List Info...")
    .Draggable()
    .Resizable()
)

@Scripts.Render("~/bundles/kendoui")
<script type='text/javascript'>
$(function () {
    // When your button is clicked
    $('#createbtn').click(function () {
        var createWindow = $('#CreateWindow').data('kendoWindow');
        createWindow.center().open();
    });
});
</script>

部分视图:

@model Banov.Controllers.Employee
<div>MY PARTIAL VIEW CONTENT GOES HERE ...</div>
<div>@(Model.Id)</div>
<div>@(Model.FirstName)</div>
<div>@(Model.LastName)</div>

控制器:

using System.Web.Mvc;
namespace Banov.Controllers
{
    public class EmployeeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        [HttpGet]
        public ActionResult _Create(int id)
        {
            var model = new Employee
                    {
                        Id = id,
                        FirstName = "John",
                        LastName = "Doe"
                    };
            return PartialView(model);
        }
    }

    public class Employee
    {
        public int Id { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
    }
}

【讨论】:

  • 非常感谢您的帮助。实际上,在尝试您发布的代码后第一次尝试它并没有工作,但我意识到在进行调试时,代码会在 javascript 行上遇到断点,并且在禁用断点后它工作(我认为主要问题是没有加载剑道网格正确,它会导致一些关于javascript的问题)。无论如何,我希望这个答案对其他人也有帮助。再次感谢。投票+
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-04-07
  • 1970-01-01
  • 1970-01-01
  • 2015-07-10
相关资源
最近更新 更多