Bonjour.
Dans le cadre d'un devoir scolaire j'essaye de faire un Morpion avec Ajax et JSP.
Bon le JSP n'est pas le problème, le soucis réside au niveau de mon code ajax, j'ai dû mal à le faire fonctionner correctement !
Voici le code:

index.html
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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
39
40
41
42
43
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta name="author" content="Miloud BELKACEM" />
        <meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" /> 
        <meta http-equiv="Content-Language" content="en" />
        <title> My first ajax page </title>
    </head>
 
    <body> <center>
<p>
    <h1>Morpion</h1>
</p>
<script type="text/javascript" src="stuff.js"></script>
 
<table border="1">
<tr>
    <td> <input id="b1" style="width:40px;" type="button" value = "-" onclick="Checked(1);"/> </td>
    <td> <input id="b2" style="width:40px;" type="button" value = "-" onclick="Checked(2);"/> </td>
    <td> <input id="b3" style="width:40px;" type="button" value = "-" onclick="Checked(3);"/> </td>
</tr>
<tr>
    <td> <input id="b4" style="width:40px;" type="button" value = "-" onclick="Checked(4);"/> </td>
    <td> <input id="b5" style="width:40px;" type="button" value = "-" onclick="Checked(5);"/> </td>
    <td> <input id="b6" style="width:40px;" type="button" value = "-" onclick="Checked(6);"/> </td>
</tr>
<tr>
    <td> <input id="b7" style="width:40px;" type="button" value = "-" onclick="Checked(7);"/> </td>
    <td> <input id="b8" style="width:40px;" type="button" value = "-" onclick="Checked(8);"/> </td>
    <td> <input id="b9" style="width:40px;" type="button" value = "-" onclick="Checked(9);"/> </td>
</tr>
</table>
<br/>
    <div id="ResDiv"></div>
    <br/>
    <input id="btnRestart" type="button" value = "Restart" onclick="Restart();"/>
 
    </center>
    </body>
</html>
stuff.js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
 
 
var xmlHttp;
 
function CreateAjaxObject ()
{
 
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    try
      {
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    catch (e)
      {
      alert("Your browser does not support AJAX!");
      xmlHttp =  null;
      }
    }
  }
 
 return xmlHttp;
}
 
function SetCheck (BtnID, player)
{
    document.getElementById(BtnID).value = player;
}
 
function Show (what)
{
    var obj = document.getElementById("ResDiv");
    document.getElementById("ResDiv").innerHTML = what;
}
 
function onReady()
{alert("aplha");
    if(xmlHttp.readyState==4){
        var response = xmlHttp.responseText;
 
        if (response == '10') // You win
        {
            Show("<p style=\"color:green;\">Nice !</p>");
        }
        else
        if (response == '20')// He win
        {
            Show("<p style=\"color:red;\">Loooooser !</p>");
        }
        else
        {
            SetCheck ('b'+response, 'X');
        }
    }
}
 
function getCombo ()
{
  var combo = '';
  var bid;
  var i;
 
    for (i=1; i<10; i++){
        bid = document.getElementById('b'+i).value;
        if (bid == '-')
            combo = combo + '0';
        else
        if (bid == 'O')
            combo = combo + '1';
        else
        if (bid == 'X')
            combo = combo + '2';
    }
 
  return combo;
}
 
function isChecked (ischck)
{
    return (document.getElementById('b'+ischck).value != '-');
}
 
function Checked (check)
{
    if (isChecked(check))
    {
        alert ("Don't think you could fool me !");
    }
    else
    {
        SetCheck ('b'+check, 'O');
        xmlHttp = CreateAjaxObject();
        if (xmlHttp != null){
            xmlHttp.onreadyStatechange = onReady();
            xmlHttp.open("GET","page.jsp?combo=" + getCombo(),true);
            xmlHttp.send(null);
        }
    }
}
 
function Restart()
{
  var i;
 
    for (i=1; i<10; i++)
        document.getElementById('b'+i).value = '-';
}
page.jsp
j'ai uniquement mis dedans: "10" pour tester j'ai pas encore incorporé mon code.

Alors le problème c'est que je reçoit pas de réponse après avoir xmlHttp.send(null), alors j'ai essayé de modifier genre mettre l'assignation du onStateChange après le send et là magique ça marche, MAIS ça ne marche que si je met un alert('quelque chose'); au début de ma fonction onReady().
Cependant avec le code ci dessus, rien ne va j'ai jamais le status 4.

Est-ce normal ?

Merci d'avance