我正在用Javascript ES5构建一个应用程序，以尝试学习JS并解决现实世界中的问题。我在访问输入数据时遇到问题。全局应用程序控制器正在尝试访问UICtrl.getInput（）;。方法。我的错误消息是“未捕获的TypeError：无法读取HTMLButtonElement.strtOrder上未定义的属性'getInput'”我检查了ID，它们是正确的，我正处于严重的困境中。任何帮助表示赞赏！
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body>
<h1>Order Pulling</h1>
<!-- action - where the form send data to -->
<!-- method - what HTTP method to be used (get/post) -->
<div class="input-group input-group-lg">
<div class="input-group-prepend">
<span class="input-group-text" id="#">Associate</span>
</div>
<label for='associate'></label>
<select required name='associate' id='associate'>
<option value='N/A'></option>
<option value='Dominique'>Dominique</option>
<option value='Jerry'>Jerry</option>
<option value='Maurice'>Maurice</option>
<option value='Jonathon'>Jonathon</option>
<option value='Simeon'>Simeon</option>
</select>
<div class="input-group input-group-lg">
<div class="input-group-prepend">
<span class="input-group-text" id="#">CUC PO #</span>
</div>
<label for='cucPo'></label>
<input type="number" placeholder='CUC PO #' id='cucPo' class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-lg" required>
</div>
<div class="input-group input-group-lg">
<div class="input-group-prepend">
<span class="input-group-text" id="#">Order Quantity</span>
</div>
<label for='orderQuantity'></label>
<input type="number" placeholder='Order Quantity' id='quantity' class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-lg" required>
</div>
<button id='startOrder' class='btn btn-outline-danger btn-lg' data-toggle="modal" data-target="#staticBackdrop">Start Order</button>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script type="text/javascript" src='CogiTrac.js'></script>
</body>
</html>
//JS Code
//GLOBAL APP CONTROLLER
var appController = (function (UICtrl,DataCtrl ){
var strtOrder = function () {
//1. Get the field input data
var input = UICtrl.getInput();
console.log(input);
}
//Event Listner for the correctInfo button
document.getElementById('startOrder').addEventListener('click', strtOrder);
//Keypress Event Listner for the ENTER button
document.addEventListener('keypress', function (event) {
if (event.keyCode === 13 || event.which === 13){
strtOrder(); }
});
})(UIController,dataController);
//UI CONTROLLER
var UIController = (function (){
return{
getInput: function () {
return {
associate: document.getElementById('associate').value,
cucPO: document.getElementById('cucPo').value,
quantity: document.getElementById('quantity').value
}
}
}
})();
//DATA CONTROLLER
var dataController = (function (){
})();