Question

我正在尝试在模态弹出窗口中显示部分视图我在主视图中添加了以下脚本

 @Scripts.Render("~/bundles/jquery")
 @Scripts.Render("~/bundles/jqueryui")
<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.20.js"> </script>
 <script type="text/javascript" src="../../Scripts/jquery-2.0.3.min.js"></script>
 <script type="text/javascript">
  $(function () {
  $('.details_display').on('click', function () {
      $(".budgetdetail").dialog({
          autoOpen: true,
          position: { my: "center", at: "top+350", of: window },
          width: 1000,
          resizable: false,
          title: 'Detail',
          modal: true,
          open: function () {
              $(this).load('@Url.Action("DisplayBudgetDetail", "Budget")');
          }
      });

  });
  });
 </script>

还有这个部门

</div>

调用弹出窗口的链接如下所示：

  @Html.ActionLink("Detail", "DBudgetDetail", new { id = item.idBudget }, new { @class = "details_display" })

然而，当我点击它时，我被重定向到一个新页面，其中包含我正在尝试显示的视图，并且没有创建弹出窗口。

调试java脚本时出现此错误

TypeError: $(...).dialog is not a function
$(".budgetdetail").dialog({

我在这里缺少什么？

Answer 1

问题出在您的脚本文件

上

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.20.js"> </script>
<script type="text/javascript" src="../../Scripts/jquery-2.0.3.min.js"></script>

<强> 1。您似乎包括两次JQuery和JQueryUI

您需要使用捆绑包（"~/bundles/jquery"＆amp; "~/bundles/jqueryui"）或脚本代码。不要同时使用它们。

<强> 2。脚本的顺序错误

<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.20.js"> </script>
<script type="text/javascript" src="../../Scripts/jquery-2.0.3.min.js"></script>

浏览器将按您包含的顺序执行脚本。首先包含JQuery UI，然后是JQuery。这些需要反过来。 JQuery UI需要JQuery才能工作。

带有partialview的模态弹出窗口

1 个答案: