Discussion :

[Florent08800]

Je dois réaliser le déroulement en ajax de plusieurs pages pour obtenir une execution plus fluide. Pour ce faire voici ma function javascript

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
<script type='text/JavaScript'>
/**
* Permet d'envoyer des données en GET ou POST en utilisant les XmlHttpRequest
*/
function sendData(data, page, method)
{
    if(document.all)
    {
        //Internet Explorer
        var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
    }//fin if
    else
    {
        //Mozilla
        var XhrObj = new XMLHttpRequest();
    }//fin else
 
    //définition de l'endroit d'affichage:
    var content = document.getElementById("zone_avis");
 
    //si on envoie par la méthode GET:
    if(method == "GET")
    {
        if(data == 'null')
        {
            //Ouverture du fichier sélectionné:
            XhrObj.open("GET", page, true);
        }//fin if
        else
        {
            //Ouverture du fichier en methode GET
            XhrObj.open("GET", page+"?"+data, true);
        }//fin else
    }//fin if
    else if(method == "POST")
    {
        //Ouverture du fichier en methode POST
        XhrObj.open("POST", page);
    }//fin elseif
 
    //Ok pour la page cible
    XhrObj.onreadystatechange = function()
    {
        if (XhrObj.readyState == 4 && XhrObj.status == 200)
            content.innerHTML = XhrObj.responseText ;
    }    
 
    if(method == "GET")
    {
        XhrObj.send(null);
    }//fin if
    else if(method == "POST")
    {
        XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
        XhrObj.send(data);
    }//fin elseif
}//fin fonction SendData
 
</script>

Je teste bien sur quel navigateur je me situe puisqu'avant j'ai eu des soucis en utlisant un petit framework. Je déclare ma balise <div> afin d'afficher les données dans cette partie de la page.

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
 
            <p>
                <div id="zone_avis"><!-- c\'est ici que les données récupérées vont apparaître -->';
 
if (!tep_session_is_registered('customer_id')) {
    echo "
                    <a href=\"javascript:sendData('null','Zlogin.php?products_id=".$products_id.
                    "', 'GET')\">".TEXT_WRITE_REVIEW."</a>.<br>".TEXT_WRITE_REVIEW2." <a href='service_concours.php'>"
                    .TEXT_WRITE_REVIEW3."
                    </a>)";
} else {
    echo "
                    <a href=\"javascript:sendData('null','Zform.php', 'GET')\">".TEXT_WRITE_REVIEW5."</a>.<br>"
                    .TEXT_WRITE_REVIEW4."<a href='service_concours.php'>"
                    .TEXT_WRITE_REVIEW3."</a>)";
}
echo '
                </div>
            <p>

L'execution se déroule correctement suivant si l'utilisateur est loggué ou pas. Prenons le cas ou l'utilisateur est loggué.
Ma page Zlogin.php s'affiche correctement, mais cependant il y a un petit soucis puisque avant de transmettre les données du formulaire (vérifier si l'utilisateur a bien rempli le formulaire), la 1ère que l'utilisateur saisit, ma function ne s'execute pas (pas d'affichage d'alert), mais en revenant une deuxième fois à l'endroit du formulaire, la fonction s'execute correctement cela n'est pas un soucis de navigateur puisque cela se produit aussi bien sur firefox que sur IE.

voici le code de Zlogin.php:

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
 
   echo "<form name='reviews' method='post'>";
 
       echo "<table border='0' width='100%' cellspacing='0' cellpadding='0'>
        <tr>
           <td class='main'>" .tep_draw_textarea_field('review', 'soft', 67, 10). "</td>
        </tr>
        <tr>
           <td class='smallText' align='right'>" . TEXT_NO_HTML . "</td>
        </tr>
        <tr>
           <td class='main'><b>" . SUB_TITLE_RATING . "</b> " . TEXT_BAD . "
           <input type='radio' value='1' id='radio1' name='note'>
           <input type='radio' value='2' id='radio2' name='note'>
           <input type='radio' value='3' id='radio3' name='note'>
           <input type='radio' value='4' id='radio4' name='note'>
           <input type='radio' value='5' id='radio5' name='note'> " . TEXT_GOOD . "</td>
        </tr>
        </table></form>
        ";
 
echo "<br>
        <a href=\"javascript:sendData('null','Zajout.php?products_id=".$products_id."&rating='+getValRadio(document.reviews.note)+'&review='+document.reviews.review.value, 'GET')\" onClick=\" return verif_form();\">Valider</a>&nbsp;&nbsp;
        <a href=\"javascript:sendData('null','Zaccueil.php?products_id=".$products_id."', 'GET')\">Annuler</a>
        ";
}

voici le code de ma function de vérification:

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
 
function verif_form()
{
var error = false;
var message = 'Le formulaire n\'est pas valide, vous devez saisir : \n';
 
    if(document.reviews.review.value.length < <?php echo $size; ?>) {
            error = true;
            message = message + '* le champ commentaire (30 cartères minimum) \n';
    }
    if ((!document.getElementById('radio1').checked)
        && (!document.getElementById('radio2').checked)
        && (!document.getElementById('radio3').checked)
        && (!document.getElementById('radio4').checked)
        && (!document.getElementById('radio5').checked)){
            error = true;
            message = message + '* le champ note \n';
    }
    if (error == true){
        window.alert(message);
        return false;
    }
    else{
        return true;
    }
 
}

Je débute en Ajax, donc je demande votre aide car j'ai un peu de mal . Je vous remercie d'avance.

[Florent08800]

Suite à une serie supplémentaire de test je me suis aperçu que le problème venait de mes boutons radio; lors de la 1ère execution ils ne sont pas définis c'est uniquement lors d'un réaffichage de ma balise <div> qu'il existe bien au niveau de javascript et ma function javascript reconnait bien document.reviews.review.value

Pourtant lors de mon 1er affichage, mes boutons existent bien puisque je les visualise surmon navigateur.

Si quelqu'un aurait une idée je lui serai reconnaissant.