MVC jQuery : impossible d'appeler une méthode de la vue à partir du contrôleur
Bonjour ,
Je suis entrain de mettre en place une architecture MVC, j'ai déclarer un model, une view, et un controller. dans le controller je récupère des information via un fichier .json, et je crée des divs dynamiquement afin de les mettre en place dans le html. Cependant je n'arrive à appeler une méthode de la vue à partir du controller et je ne comprend pas l'erreur que j'ai :
voici le controller :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
| function controllerRestaurant(model, view) {
this.model = model;
this.view = view;
}
var getRestaurants = function (){
// Set the global configs to synchronous
$.ajaxSetup({
async: false
});
$.getJSON('restaurants.json', function(data,status) {
if (status == "success"){
// parcours sur les restaurants
$.each(data.restaurants, function(index, d) {
//parcours sur les ratings
var ratings = new Array();
$newDivListGroup = this.view.getListGroup(); // je n'arrive pas à appeler cette méthode de la vue
//$newDivListGroup = $("<ul class='list-group'></ul>");
$.each(d.ratings, function(index2, d2) {
$newDivListGroup.append(this.view.buildRatings(d2.stars,d2.comment));
var comment = new Comment(d2.stars, d2.comment);
ratings.push(comment);
});
this.view.buildRestaurant(index,$newDivListGroup,d.restaurantName,d.address);
var restaurant = new Restaurant(d.id, d.restaurantName, d.address, d.lat, d.long, ratings);
this.model.addRestaurant(restaurant);
});
}else if (status == "timeout"){
alert("Something is wrong with the connection");
}else if (status == "error" || status == "parsererror" ){
alert("An error occured");
}else{
alert("datatosend did not change");
}
}); |
voici la view :
Code:
1 2 3 4 5 6
| function viewRestaurant(restaurants) {
this.restaurants = restaurants;
}
var getListGroup = function () {
return $('<ul class="list-group"></ul>');
} |
voici le main :
Code:
1 2 3 4 5 6 7 8 9 10 11 12
| $(function () {
var restaurants = new Array();
// MVC
var model = new modelRestaurant(restaurants);
var view = new viewRestaurant(restaurants);
var controller = new controllerRestaurant(model, view);
controller.getRestaurants();
}); |
voici l'erreur que j'ai :
Citation:
Uncaught TypeError: Cannot read property 'getListGroup' of undefined
at Object.<anonymous> (http://127.0.0.1/projet7/controllerRestaurant.js:53:46)
at Function.each (https://code.jquery.com/jquery-3.2.1.min.js:2:2715)
at Object.success (http://127.0.0.1/projet7/controllerRestaurant.js:50:15)
at i (https://code.jquery.com/jquery-3.2.1.min.js:2:28017)
at Object.fireWith [as resolveWith] (https://code.jquery.com/jquery-3.2.1.min.js:2:28783)
at A (https://code.jquery.com/jquery-3.2.1.min.js:4:14035)
at XMLHttpRequest.<anonymous> (https://code.jquery.com/jquery-3.2.1.min.js:4:16323)
at Object.send (https://code.jquery.com/jquery-3.2.1.min.js:4:16670)
at Function.ajax (https://code.jquery.com/jquery-3.2.1.min.js:4:13502)
at Function.r.(anonymous function) [as get] (https://code.jquery.com/jquery-3.2.1.min.js:4:14489)
(anonymous) @ controllerRestaurant.js:53
each @ jquery-3.2.1.min.js:2
(anonymous) @ controllerRestaurant.js:50
i @ jquery-3.2.1.min.js:2
fireWith @ jquery-3.2.1.min.js:2
A @ jquery-3.2.1.min.js:4
(anonymous) @ jquery-3.2.1.min.js:4
send @ jquery-3.2.1.min.js:4
ajax @ jquery-3.2.1.min.js:4
r.(anonymous function) @ jquery-3.2.1.min.js:4
getJSON @ jquery-3.2.1.min.js:4
getRestaurants @ controllerRestaurant.js:47
(anonymous) @ main.js:11
j @ jquery-3.2.1.min.js:2
k @ jquery-3.2.1.min.js:2
setTimeout (async)
(anonymous) @ jquery-3.2.1.min.js:2
i @ jquery-3.2.1.min.js:2
fireWith @ jquery-3.2.1.min.js:2
fire @ jquery-3.2.1.min.js:2
i @ jquery-3.2.1.min.js:2
fireWith @ jquery-3.2.1.min.js:2
ready @ jquery-3.2.1.min.js:2
S @ jquery-3.2.1.min.js:3
Merci de votre compréhension