Question

我正在为简单的一个表创建一个Create，Edit，Delete应用程序。我准备了Create get method和create post method个视图，因为我使用实体框架创建了我的项目。

现在在我当前的应用程序中它打开一个新页面来创建新数据，我想要的是打开一个弹出窗口，其中我添加了必需的字段，而且当我点击ADD时它会将这些数据添加到数据库中。

FloorFactorsController.cs

public PartialViewResult Create()
{
    return PartialView();
}

[HttpPost]
[ValidateAntiForgeryToken]

public ActionResult Create([Bind(Include = "FloorFactorPercentage,FromDate,ToDate")] FloorFactor floorFactor)
{
    if (ModelState.IsValid)
    {
        db.FloorFactors.Add(floorFactor);
        db.SaveChanges();
        return RedirectToAction("Index");
    }

    return View(floorFactor);
}

索引view.cshtml需要部分完整代码。`

在这里，我添加了一个ajax.actionlink，用于添加一个CREATE NEW链接，该链接重定向到控制器类中的get method create。我添加了所有必需的.css和js文件，即jquery.js, dialog.js,dialog.css etc.

<p>
   @Ajax.ActionLink("Create New", "Create", new AjaxOptions { HttpMethod = "Get" ,UpdateTargetId = "result", InsertionMode = InsertionMode.Replace, OnSuccess = "openPopup" }) <br />
</p>

<div id="result" style="display:none;">
    <button type="button">success</button>
</div>

<script type="text/javascript">
$(document).ready(function() {
    $("#result").dialog({
        autoOpen: false,
        title: 'Title',
        width: 500,
        height: 'auto',
        modal: true
    });
});
function openPopup() {
    $("#result").dialog("open");
}
</script>
`

它给出了错误

对象不支持属性或方法'对话'

我不知道该怎么做我已经提到了这个QUESTION 但是这对我不起作用。

编辑 _layout.cshtml文件

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="~/Scripts/modernizr-2.6.2.js"></script>

<script type="text/javascript" src="~/Content/jquery-2.2.3.js"></script>
<link type="text/css" href="~/Content/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="~/Content/jquery-ui.js"></script>
<script src="~/Content/dialog.js"></script>
<link href="~/Content/dialog.css" rel="stylesheet" />

Answer 1

抱歉，由于我的声誉低于50，我无法添加评论。您是否读过此内容： Object doesn't support property or method 'dialog' ？我认为你没有正确地包含jquery文件。

Answer 2

我的猜测是您正在导入CDN或下载的jQuery UI版本，但不包含对话框小部件。

要测试此理论，请使用以下命令替换jQuery UI的脚本参考：

<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

我还有其他问题，因为您的控制器使用ActionResult方法代替JsonResult以及为什么要向方法获取请求用[HttpPost]修饰的，但这不是你在这个问题中提出的问题。

Answer 3

经过这么多新的冲浪后，我找到了一些有用的链接，并解决了我的问题。

为了使用jquery-ui文件，我需要将这些文件放在@ Scripts.render中（＆＃34;＆＃34;）;因为最佳做法是在其中添加所有脚本和样式文件以获得更好的性能。

我无法添加@Script＆amp; @Styles在我的项目中。它给了我错误，它不在上下文中。所以这Question解决了我的问题。比我刚刚粘贴链接，我的对话框开始正常工作。我还在尝试使用ajax打开对话框，但我使用javascript打开了对话框。

使用javascript打开弹出的代码：

    <div>
        <input type="text" id="Name" />
        <input type="text" id="Address" />
        <button onclick="OpenDialog()">
            Open Dialog</button>
    </div>
<div id="Dialog-Box">
        <input type="text" id="Dialog-Name" />
        <input type="text" id="Dialog-Address" />
        <input type="submit" onclick="onsave()" value="save" />
    </div>
    <script>
    $('#Dialog-Box').dialog({
            autoOpen: false,
            height: 500,
            width: 700,
            modal: false
        });
    function OpenDialog() {

            var name = $('#Name').val();
            var address = $('#Address').val();
            $('#Dialog-Name').val(name);
            $('#Dialog-Address').val(address);
            $('#Dialog-Box').dialog('open');
        }
    function onsave() {

            $.ajax({
                url: '@Url.Action("ActionName", "ControllerName")',
                type: 'POST',
                data: {
                    name: $('#Dialog-Name').val(),
                    address: $('#Dialog-Address').val()
                },
                success: function (msg) {
                },
                error: function (msg) {
                }
            });

        }
    </script>

感谢大家的努力。

弹出Mvc Create按钮需要帮助C＃.net

3 个答案: