Usin ajax request on php MVC



我正在用php和javascript制作一个游戏网站。所以我的类和我的数据是用php编写的,我用json数据类型编码它们。我调用我的视图,它本身调用js文件,由于ajax请求,恢复了用json编码的php数据并使用javascript发布它们。我的问题是我不知道如何将其集成到我的 mvc 中,即,通过操作浏览我的索引,而不是直接调用我的观点。

我的控制器 :

class Controlleur
{
public function __construct() {
global $rep,$vues;
try{
$action=$_REQUEST['action'];
switch($action){
case NULL:
$this->homePage();
break;
case "VoirScore":
$this->afficherScore();
break;
default:
$dVueEreur[] =  "Erreur d'appel php";
require ($rep.$vues['error']);
break;
}
} catch (PDOException $e)
{
echo $e->getMessage();
$dVueEreur[] =  "Erreur inattendue PDO!!! ";
require ($rep.$vues['error']);
}
catch (Exception $e2)
{
$dVueEreur[] =  "Erreur inattendue!!! ";
require ($rep.$vues['error']);
}
}
public function homePage(){
global $vues, $rep;
require($rep . $vues['homePage']);
}

我的索引 :

session_start();
Autoload::charger();
new Controlleur();

我的 Js ajax 请求:

var Game = {
cards: [],
selected: [],
score: 0,
$board: $('[data-display="game-board"]'),
$score: $('[data-display="score"]'),

deal: function() {
var self = this;
var dealRequest = $.ajax({
url: 'set.php?action=deal',
type: 'GET',
dataType: 'json',
success: function(data) {
self.cards = data;
self.displayCards.call(self);
self.setCardListeners();
self.setPageListeners();
}
}); },

如果您需要更多解释或更多细节,您可以向我提问。

这是调用其他视图和设置的视图主页.js是将javascript文件与ajax集成的文件,您可以看到我没有操作即可调用她。

<div class="menu box">
<a href="#" class="logo">HyperSet</a>
<a href="set.html">Jouer</a>
<a href="index.php?action=VoirScore">Voir Les Scores</a>
<a href="#">Règles</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" src="vues/js/Settings.js"></script>

这是我的一套.html

<div class="wrapper">
<h1>(TEST) Set</h1>
<p>Find sets.</p>
<p>Sets found:  <span data-display="score" class="score">0</span></p>
<p>Number of Sets:  <span data-display="nbSets" class="nbSets"></span></p>
<div class="game-board" data-display="game-board" style="display: block;" ></div>
</div>

</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="vues/js/set.js"></script>

最新更新