0
私のウェブページがロードされている間、モジュールのロードに問題があります。 medication.phpファイルがあり、そのファイルにmedication.jsのjavascriptファイルに接続しています。このjavascriptファイルには、モジュールをロードしてコントローラを設定しています。私はクロムとサファリでこれを試しました。また、ページが最初に読み込まれたときにエラーがスローされ、ページがリフレッシュされるたびに7〜8回1回スローされます。
This pageを数回リロードして内容をランダムにテストすると、コンテンツがランダムに表示されず、以下のエラーが表示されます：
このエラーは、モジュールが例外によってロードに失敗したときに発生します。上記のエラーメッセージは、追加のコンテキストを提供する必要があります。ブラウザがリフレッシュされるたびにモジュールがロードされません。
モジュールが読み込まれない一般的な理由は、定義されたモジュールにファイルを含めるのを忘れてしまったり、ファイルを読み込めなかったりする一般的な理由です。 medication.php：medication.jsとAngular CDNが読み込まれます。あなたが見ることができるように、私はng-appを持っていて、私もng-controllerを持っています。
<html ng-app="myModule1">
<head>
<meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Shop For Medication </title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<link rel="stylesheet" type="text/css" href="vex/dist/css/vex.css"/>
<link rel="stylesheet" type="text/css" href="vex/dist/css/vex-theme-os.css"/>
</head>
<body>
<ul class="nav nav-tabs">
<div class="container">
<div class="navbar-header" style="background-color:#2a6cd6">
<a class="navbar-brand" href="#">The Med Company</a>
</div>
<ul class="nav navbar-nav" style="background-color: #2a6cd6" role="navigation">
<li ><a href="homepage.php"> Home Page</a> </li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Purchase Something<span class="caret"></span> </a>
<ul class="dropdown-menu">
<li><a href="vitamins.php">Vitamins</a></li>
<li><a href="medication.php">Medication</a></li>
</ul>
</li>
<li><a href="aboutus.php">About Us</a></li>
</ul>
<ul class="nav navbar-nav navbar-right" style="background-color:#2a6cd6"role="navigation">
<li><a href="./checkout.php" id="check-out"><span class="glyphicon glyphicon-shopping-cart"></span>Check Out</a></li>
<li><a href="#" id="sign-out"><span class="glyphicon glyphicon-user"></span> Sign Out</a></li>
</ul>
</div>
</ul>
<div class="container" ng-controller="mycontroller1" ng-cloak>
<table class="table table-hover table-condensed">
<thead>
<tr>
<th style="width:50%">Product</th>
<th style="width:10%">Price</th>
<th style="width:10%">Quantity</th>
<th style="width:10%">Subtotal</th>
<th style="width:20%"></th>
</tr>
</thead>
<form id="medication-product-1" method="POST">
<tbody>
<tr>
<td data-th="Product">
<div class="row">
<div class="col-sm-2">
<img id="small-pic2" src="images/benadryl.png"></img>
</div>
<div class="col-sm-10">
<h4 class="nomargin"><input type="hidden" name="name1" value="Benadryl">
Benadryl</input>
</h4>
<p>
A medication which reduces itching, sneezing, coughing through because of its properties as an anti-histamine.
</p>
</div>
</div>
</td>
<td data-th="Price"><input type="hidden" name="Price1" value=01.99>
$1.99</input>
</td>
<td data-th="Quantity">
<input type="number" ng-model="subtotal.subtotal1" ng-init="subtotal.subtotal1=0" name="Quantity1" ng-change="changed()" id="amount1" class="form-control text-center" min="0"/>
</td>
<td data-th="Subtotal" id="subtotal-1" name="Subtotal" class="text-center" ng-bind="1.99*subtotal.subtotal1"></td>
<td>
<input type="hidden" name="step" value="1"></input>
<button type="button" id="button1" name="button-1" class="btn btn-primary">
Add To Cart<span class="glyphicon glyphicon-shopping-cart"></span>
</button>
</td>
</tr>
</form>
<form id="medication-product-2" method="POST">
<tr>
<td data-th="Product">
<div class="row">
<div class="col-sm-2">
<img src="images/motrin.jpg" id="small-pic"></img>
</div>
<div class="col-sm-10">
<h4 >
<input type="hidden" name="name2" value="Motrin"></input>
Motrin
</h4>
<p>
Pain Reliever and Fever Reducer
</p>
</div>
</div>
</td>
<td data-th="Price">
<input type="hidden" name="Price2" value="3.99">
$3.99
</input>
</td>
<td data-th="Quantity">
<input type="number" ng-model="subtotal.subtotal2" ng-change="changed2()" ng-init="subtotal.subtotal2=0" name="Quantity2"
id="amount2" min="0" class="form-control text-center"></input>
</td>
<td data-th="Subtotal" id="subtotal-2"
name="Subtotal" ng-bind="3.99*subtotal.subtotal2" class="text-center" >
</td>
<td>
<input type="hidden" name="step" value="2"></input>
<button type="button" id="button2" name="button-2" class="btn btn-primary">
Add To Cart<span class="glyphicon glyphicon-shopping-cart"></span>
</button>
</td>
</tr>
</tbody>
</form>
</table>
</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-3.1.1.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="vex/dist/js/vex.combined.js"></script>
<script type="text/javascript"> vex.defaultOptions.className = 'vex-theme-os'</script>
<script type="text/javascript" src="js/medication.js"></script>
<script type="text/javascript" src="js/signout.js"></script>
</body>
</html>
medication.js
window.onload=function(){
button1=document.getElementById("button1");
button2=document.getElementById("button2");
number1=document.getElementById("amount1");
number2=document.getElementById("amount2");
number1.value=0;
number2.value=0;
button1.disabled=true;
button2.disabled=true;
var medicine=angular.module("myModule1",[])
.controller("mycontroller1",function($scope){
var subtotal={
subtotal1:0,
subtotal2:0
}
$scope.subtotal=subtotal;
$scope.changed=function(){
if(subtotal.subtotal1>0){
button1.disabled=false;
}
else {
button1.disabled=true;
}
}
$scope.changed2=function(){
if(subtotal.subtotal2>0){
button2.disabled=false;
}
else{
button2.disabled=true;
}
}
});
button1.onclick=function(){
vex.dialog.buttons.YES.text="Purchase"
vex.dialog.buttons.NO.text="Cancel"
vex.dialog.confirm({
message:"Are you sure you want to purchase this item?",
callback: function(value){
var data=$("#medication-product-1").serialize();
$.ajax({
type:'POST',
url:'./php/add-medicine-to-cart.php',
data:data,
success: function(response){
console.log(response);
}
});
}
});
}
button2.onclick=function(){
vex.dialog.buttons.YES.text="Purchase"
vex.dialog.buttons.NO.text="Cancel"
vex.dialog.confirm({
message:"Are you sure you want to purchase this item?",
callback: function(value){
var data=$("#medication-product-2").serialize();
$.ajax({
type:'POST',
url:'./php/add-medicine-to-cart.php',
data:data,
success: function(response){
console.log(response);
}
});
}
});
};
}