11521 sujets

JavaScript, DOM et API Web HTML5

Code php dans du script

bonjour je vaudrais enregistrer dans un fichier un mot clé. pour cela j'utilise du script et du php mais le php s'exécute pas comme je le veux je n'arrive pas a comprendre pourquoi cela ne fonctionne pas.
voila ce que je voudrais:
quand je clique sur limage 1 cela appelle une fonction qui écrit une ligne dans un fichier selon l'image sur laquelle on a cliquez

mais cela ne fonctionne pas !! le fichier ce crée et écrie le dernier résultat dedans.
voici mon code :

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf8" />

<title></title>

<script>
function charge($recherche) {
if ($recherche=="Tous") {
<?php
$monfichier = fopen('recherche.txt', 'w');
$$ligne1 = 'Tous';
fwrite($monfichier, $ligne1);
fclose($monfichier);
?>
};

if ($recherche=="Rien") {
<?php
$monfichier = fopen('recherche.txt', 'w');
$ligne1 = 'Rien';
fwrite($monfichier, $ligne1);
fclose($monfichier);
?>
};
};
</script>
</head>
<body >

<a onclick="charge('Tous')" target="_top" style="color:#000000; text-decoration:none">
<div style="position:absolute; left:0px; top:0px; width:185px; height:40px"><img src="image_site/fond06.jpg" style="position:absolute; left:0px; top:0px; width:185px; height:40px">
<div style="position:absolute; left:0px; top:10px; width:185px; height:30px;">Tous</div>
</div>
</a>

<a onclick="charge('Rien')" target="_top" style="color:#000000; text-decoration:none">
<div style="position:absolute; left:250px; top:0px; width:185px; height:40px"><img src="image_site/fond06.jpg" style="position:absolute; left:0px; top:0px; width:185px; height:40px">
<div style="position:absolute; left:0px; top:10px; width:185px; height:30px;">Rien</div>
</div>
</a>

</body>

</html>
d'accord merci
mais alors comment pourrai-je appeler une fonction php depuis onclick ou autre !!
tony44 a écrit :
d'accord merci
mais alors comment pourrai-je appeler une fonction php depuis onclick ou autre !!


avec Ajax ... XMLHttpRequest
Modérateur
Et l'eau,

@lionel_css3:
Ce n'est pas obligatoire (traitement de la requête et ensuite redirection de la page cible via le http_referer). Mais par souci d'une meilleur navigation, on utilise en effet l'Ajax.

@tony44:
Je t'ai corrigé pleins d'endroits et j'ai assaini le code. Parce que même si tu renverses ton ordinateur, je suis sûr que le code reste collé tellement qu'il est lourd, compact et illisible. J'ai écrit le JS à l'ancienne (utilisation de closure pour capturer l'élément cliqué....). Depuis, on utilise des techniques différentes....

Aussi, pour le php, je t'invite à adapter et à mieux filtrer les données (tout comme le JS).


<?php 
$accept_data = [
    'Tous',
    'Rien'
];
if(!empty($_POST['clicktofile']) && in_array($_POST['clicktofile'], $accept_data)){
    file_put_contents('clickcontentfile.txt', $_POST['clicktofile']);
}
?>
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        a{
            display: block;
        }
    </style>
</head>
<body>
    <nav>
        <a href="#">
            <img src="http://via.placeholder.com/350x150" alt="all">
            <div>Tous</div>
        </a>
        <a href="#">
            <img src="http://via.placeholder.com/350x150" alt="nothing">
            <div>Rien</div>
        </a>
    </nav>
    <p id="result"></p>
    <script>
        window.addEventListener('DOMContentLoaded', function(){
            var $a = document.querySelectorAll('nav a');

            for(var i = 0; i < $a.length; i++){
                (function(i){
                    $a[i].addEventListener('click', function(e){
                        var txtImg = this.querySelector('div').textContent,
                            xhr = new XMLHttpRequest();

                        xhr.addEventListener('readystatechange', function(){
                            if (this.readyState == 4 && this.status == 200) {
                                document.getElementById('result').textContent = "Le texte suivant vient d'être saisi dans un fichier texte : " + txtImg;
                            }
                        }, false);
                        xhr.open("POST", window.location.pathname, true);
                        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                        xhr.send("clicktofile="+txtImg);
                        e.preventDefault();
                    });
                })(i);
            }
        });
    </script>
</body>
</html>

Modifié par niuxe (12 Mar 2018 - 16:25)
Modérateur
Pas de souci Smiley smile

J'ai oublié une chose. N'utilise pas file_put_content(), mais plutôt fopen() avec comme second paramètre a+ (RTFM). Ça devrait mieux aller suivant ta contrainte.
Modifié par niuxe (12 Mar 2018 - 19:33)
Sujet clos
Aller à