Différentes données pour des dates différentes

Question

Je crée une page web qui permettra aux utilisateurs d'entrer et d'afficher des données pour différentes dates, et pour changer la date, il y a deux boutons, dont l'un affichera le jour précédent, et un autre montrera le jour suivant. Je sais que je peux le faire en soumettant des formulaires et en rechargeant la page chaque fois qu'ils pressent un de ces boutons, mais je préfère utiliser javascript et ne pas avoir à soumettre un formulaire, mais j'ai du mal à le faire fonctionner. À l'heure actuelle, j'ai les deux boutons et la date stockée dans une variable PHP, comme indiqué dans mon code ci-dessous:

<script> 
function init() { 
    <? $nutrDate = $this->parseDate(date('m/d/Y')); ?> 
} 
function nutrPrevDay() {  
    <? $nutrDate = mktime(0, 0, 0, date('m',$nutrDate), date('d',$nutrDate)-1, date('Y',$nutrDate)); ?> 
    alert("<? echo(date("m/d/y", $nutrDate)) ?>"); 
} 
function nutrNextDay() { 
    <? $nutrDate = mktime(0, 0, 0, date('m',$nutrDate), date('d',$nutrDate)+1, date('Y',$nutrDate)); ?> 
} 
window.onload = init; 
</script> 

<p style="text-align:center; font-size:14px; color:#03F"> 
    <button onclick="nutrPrevDay()" style="width:200px" >< Show Previous Day</button>     
    <? echo(date('m/d/Y', $nutrDate)) ?>   
    <button onclick="nutrNextDay()" style="width:200px">Show Next Day ></button> 
</p> 

Je l'alerte dans le nutrPrevDay() uniquement comme le débogage. Ce qui se passe est quand je clique sur le bouton, l'alerte montre que le jour est correctement diminué (par exemple du 17 mai au 16 mai), mais seulement diminue un jour, et non un jour pour chaque clic. De plus, je ne sais pas comment modifier le texte de la page (créé par la ligne) pour afficher la nouvelle date après un clic sur un bouton. 1) Est-il possible de changer dynamiquement des données (comme du texte, et dans le futur, des requêtes SQL) sur une page en utilisant javascript sans avoir à recharger une page en cliquant sur un bouton? 2) Si possible, comment puis-je faire ces changements? 3) Comment puis-je corriger cela pour qu'il incrémente et décrémente les dates à chaque fois que l'on clique sur un bouton?

Answer 1

Q1:

Oui, il est possible, AJAX est probablement ce que vous cherchez.

Q2:

Eh bien, tout d'abord vous devez apprendre que JavaScript fonctionne à côté client alors que PHP fonctionne à côté serveur. Dans cet esprit, vous ne pouvez pas vous attendre à ce que les scripts PHP soient exécutés lorsque vous cliquez sur un bouton simplement parce que vous les avez écrits dans des fonctions javascript.

Le plus que vous pouvez faire est d'imprimer quelque chose à partir d'un script PHP dans un script JavaScript. Et votre script échoue à cela, sauf pour la partie alerte. Exemple:

<script> 
function javascriptFunction(){ 
    // This php script, will be executed when you call your page, however $nutrDate is an assigned php variable, javascript will never know about it; 
    <?php $foo = 'bar'; ?> 
    // This will give you a javascript error because $foo is a string 
    var foo = <?php echo $foo; ?>; 
    // This is the code which will do the expected, notice the quotes. 
    var foo = '<?php echo $foo; ?>'; 

    // If you have a single quote inside $foo, it will break javascript 
    <?php $foo = "ba'r"; 
    var foo = '<?php echo $foo; ?>'; 
} 
</script> 

Q3:

L'idée est de faire une requête AJAX à chaque fois que vos boutons cliquez événement est déclenché ... C'est la même chose que dire, lorsque vous cliquez sur un bouton, vous appelez une fonction javascript qui fera une demande à une autre page et en obtiendra quelque chose si la requête aboutit. Voici l'exemple:

<script> 
var current = <? echo time(); ?>; 
function requestSomething(action){ 
    if (window.XMLHttpRequest) { 
     xmlhttp=new XMLHttpRequest(); 
    } 
    else { 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function(){ 
     // readyState info: http://www.devguru.com/technologies/xmldom/quickref/httpRequest_readyState.html 
     if (xmlhttp.readyState==4 && xmlhttp.status==200){ 
     // this is where we tell where the result will appear 
     document.getElementById("current").innerHTML=xmlhttp.responseText; 
     current = xmlhttp.responseText; 
     } 
    } 

    xmlhttp.open("GET","somescript.php?action="+action+'&curday='+current,true); 
    xmlhttp.send(); 
} 
</script> 

<p style="text-align:center; font-size:14px; color:#03F"> 
    <button onclick="requestSomething('decrease')" style="width:200px" >< Show Previous Day</button> 
    <!-- this is where the result will appear --> 
    <span id="current"></span> 
    <button onclick="requestSomething('increase')" style="width:200px">Show Next Day ></button> 
</p> 

Maintenant, à votre fichier somescript.php,

<?php 
    if(isset($_GET['action'])){ 
    if($_GET['action'] == 'increase'){ 
     // your increasing day logic here 
    } elseif ($_GET['action'] == 'decrease'){ 
     // decreasing logic here 
    } else { 
     // whatever... 
    } 
    } 
    ?> 

Note: Ceci est presque écrit à partir de zéro et avec une copie/passé ici et là, et n'a pas vérifiez si le code fonctionne réellement ... C'est juste une ligne directrice ...

Espérons que cela aide.

Answer 2

Vous n'avez pas besoin d'Ajax pour cela. Il y a très peu de choses que vous pouvez faire avec PHP - vous ne devriez utiliser Ajax que lorsque vous avez absolument besoin de communiquer avec le serveur (ex: besoin de quelque chose de la base de données, etc.).Même si vous utilisez Ajax plus tard, vous ne devriez pas l'utiliser partout, surtout quand un simple script peut résoudre vos problèmes. Comme il arrive, Javascript a un certain nombre de fonctions de date intégrées qui sont tout aussi puissantes que PHP .... et si elles ne font pas ce dont vous avez besoin hors de la boîte, vous pouvez facilement écrire votre propre .

http://www.w3schools.com/jsref/jsref_obj_date.asp

Keep it simple.