$(...)。对话框不是mvc5

时间:2016-11-26 10:26:41

标签: jquery asp.net-mvc-5

窗口基于下拉选择。因为我得到这个错误 $(...)。对话框不是一个函数我通过使用jquery插件尝试了很多方法。仍未解决问题

我的观看代码

@model ThreeTierArchitectureMVC.Models.VisitorsFormModel
@{
ViewBag.Title = "SaveVisitorsForm";
 }
 <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
 <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
 <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />

 @using(Html.BeginForm())
 { 

 <form>
<fieldset>

 <div class="col-sm-3">
 <div class="form-group">
 <span style="color: #f00">*</span>
 @Html.Label("Purpose of Visit", new { @class = "control-label", styles = "font-family: Arial;" })
 @Html.DropDownList("POVisitID", null, "Select", new { @class = "form-control required" })

 <div id="dialog-modal" title="Trial Form" style="display:none"></div>
  </div>
  </div>


  <script src="~/javascript/jquery-1.10.4-ui.min.js"></script>
  <script src="~/javascript/bootstrap.js"></script>
  <script src="~/javascript/bootstrap.min.js"></script>
  <script src="~/javascript/jquery-1.9.1.js"></script>
  <script src="~/javascript/jquery-ui-1.8.24.js"></script>
  <script src="~/javascript/jquery-ui-1.8.24.min.js"></script>
  <script type="text/javascript">
  $(document).ready(function () {
    debugger;
    $('#POVisitID').change(function () {
        if ($('#POVisitID option:selected').text == "Trial") {
            $("#dialog-modal").dialog("open");
        }
      })
   })

   $(function () {
    debugger;
    $("#dialog-modal").dialog({
        resizable: false,
        width: 500,
        maxHeight: 800,
        draggable: true,
        dialogClass: 'main-dialog-class',
        autoOpen: false,
        show: {
            effect: "blind",
            duration: 1000
        },
        hide: {
            effect: "explode",
            duration: 1000
        },
        open: function () {
            var closeBtn = $('.ui-dialog-titlebar-close');
            closeBtn.append('<span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>');
        },
        close: function () {
            var closeBtn = $('.ui-dialog-titlebar-close');
            closeBtn.html('');
        },
    });
});
</script>

错误在下图中提及

$ is not define error Error

我尽力解释我的问题。任何人都可以帮我解决这个问题。 Itried很多方法仍然问题我鼻涕清除。

感谢。

1 个答案:

答案 0 :(得分:-1)

正确的答案是

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

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"> </script>
 <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />
 <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>


<script>
$(document).ready(function () {
    debugger;
    $("#POVisitID").change(function () {
        if ($("#POVisitID option:selected").text() == "Trial") {
            $("#dialog-modal").dialog("open");
        }

    })
})

 $(function () {
    debugger;
    $("#dialog-modal").dialog({
        resizable: false,
        width: 500,
        maxHeight: 800,
        draggable: true,
        dialogClass: 'main-dialog-class',
        autoOpen: false,
        show: {
            effect: "blind",
            duration: 1000
        },
        hide: {
          effect: "explode",
           duration: 1000
       },
        open: function () {
            var closeBtn = $('.ui-dialog-titlebar-close');
            closeBtn.append('<span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>');
        },
        close: function () {
            var closeBtn = $('.ui-dialog-titlebar-close');
            closeBtn.html('');
        },
    });
});
</script>