$（...）ダイアログはmvc5の関数エラーではありません

Question

ドロップダウン選択に基づくウィンドウです。このエラーが発生しました$（...）。ダイアログは関数ではありません 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> 

エラーは私の問題を説明するために私のレベル最善を尽くし

下の画像で言及されます。いずれにせよ、私はこの問題を解決するのに役立ちます。それでもいろいろなやり方で私は鼻をきれいにしました。

ありがとうございました。

Answer 1

正しい答えは非常に多くのjQueryとjQuery-UIライブラリがページにロードされた理由を

<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>