0
こんにちは、私はJavascriptの非常に一般的な問題に直面しています。エラーは
Uncaught TypeError: $(...).dialog is not a function
ですが、なぜ来るのか理解できません。私はすでに必要なすべてのファイルを含んでいます。
HTMLファイル -
<head>
<meta charset="utf-8">
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=11">
<title>Landing Page</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width; initial-scale=1.0">
<!--bootstrap-->
<link rel="stylesheet" href="styles/bootstrap.min.css" />
<!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
<link rel="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,300,400,700">
<link rel="stylesheet" href="styles/checkhover.css" />
<link rel="stylesheet" href="styles/jquery-ui.css" />
<script type="text/javascript" src="scripts/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src= "scripts/bootstrap.min.js"</script>
<script type="text/javascript" src="scripts/jquery-ui.js"></script>
<script type="text/javascript" src= "scripts/urlSpecifier.js"></script>
<script type="text/javascript" src= "scripts/landingPage.js"></script>
</head>
<body>
<div class="except_footer">
<img src="images/logo.png" class="logo"/>
<!--<div class="user_info">
<p class="uname" class="u_name">Username</p>
<p class="logout"><a href="" class="link"> Out </a></p>
</div>-->
<!--test hover dropdown-->
<div class="row row1">
<div class="col-md-4 col-xs-2 col-md-offset-1 user_info">
<p id = "welcomeMsg" class="dropbtn">
</p>
<div id = "dropdown" class="dropdown-content">
<a href= "#" id = "refDataPageLink" onClick= refData() class="refDataLink">Manage Reference Data</a>
<br />
<a href= "#" onClick= openHelp() class="helpLink">Help</a>
<br />
<a href= "#" class="logoutLink" onclick=onLogout()>Log Out</a>
<br />
</div>
</div>
</div>
<!--test hover dropdown-->
<div class="row row2">
<div class="col-md-2 col-xs-4 col-md-offset-3 A_page">
<button type = "button" id = "a_button" class="a_button custom" onClick = a() >A</button>
</div>
<div class="col-md-2 col-xs-3 col-md-offset-1 B_page">
<button type = "button" id = "b_button" class="b_button custom" onClick = b() >b</button>
</div>
</div>
<!--modal box-->
<div id="modelView" title="Warning!">
</div>
<!--modal box-->
</div>
<div class="footer_div">
<div class="image">
<p style="position: relative; right:0px; bottom: 0px;" class="footer_text"></p><img src="images/footer_logo.png" class="footer_img" style="position: relative;
right: 0px;
bottom: 0px;" />
</div>
</div>
</body>
</html>
私はセッションが無効であるかどうかをチェックしています私のJSファイルである - 私は私のコードを貼り付けます。無効な場合は、モーダルボックスが表示され、モーダルボックスには、正常にログアウトしたというメッセージが表示されます。
$.ajax({
url : fullAuthUrl,
dataType : 'text',
crossOrigin : true,
cache : false,
type : 'GET',
success : function(response) {
var responseBodyFull = response.replace(/^\s+|\s+$/g, '');
if (responseBodyFull == "Invalid Session Id passed") {
console.log("Invalid Session");
showModalBoxForInvalidSessionInfo();
}
console.log(responseBodyFull);
enableOrDisableLinks(responseBodyFull);
}
});
ので、対応して、私はを取得していますならば、私は、モーダルボックスを与える関数を呼び出していますを「無効なセッションIDが渡されました」。
function showModalBoxForInvalidSessionInfo(){
$("#modelView").dialog({
autoOpen : false,
modal : true,
buttons : [ {
text : "OK",
icons : {
primary : "ui-icon-heart"
},
click : function() {
$(this).dialog("close");
window.close();
}
}]
});
$("#modelView").dialog("open");
$("#modelView").text("Logout Succesfully");
}
ここではエラーが発生しています。私は同じ問題があったリンクを調べましたが、JSファイルも含めています。私は最初にdialougeボックスを初期化しています。
"bootstrap-modal"タグを質問に設定しましたが、問題の原因となっているダイアログ関数はjquery-ui機能です。ブートストラップはモーダルを使用し、jquery-uiはダイアログを使用します。これを詳しく教えていただけますか？ –
また、インポートを指定したところで、私はこの '