2010-09-26 3 views
0

J'ai ce code:Comment changer ce code afin de travailler d'une autre manière

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
     <script> 
     $(function() { 
     $(".button").click(function() { 

      var dataString = "message= "+$('#message').val(); 
      $.ajax({ 
      type: "POST", 
      url: "calculate.php", 
      data: dataString, 
      success: function(data) { 
       $('#result').append("<div id='message'> "+ data +" </div>"); 
      } 
      }); 
     return false; 
     }); 
    }); 
     </script> 
    </head> 
    <body> 
    <div class="content"> 

    <?php 
    displayForm(); 

    function displayForm() { 
    ?><div id="result"></div> 
    <div class="content2"> 
     <form action="practicalTask.php" method="post"> 
      <div class="firstLine"> 
      <label for="message"> Message </label> <div class="time"> Time </div> 
      </div> 
      <div class="secondLine"> 
       <input type="text" name="message" id="message" onclick="this.value='';" onblur="this.value=!this.value?' Please enter a message...':this.value;" value=" Please enter a message..." />pr 
       <input type="submit" name="submitButton" class="button" value="OK" /> 
      </div> 

     </form> 
     <br/> 
    </div> 
    <div id="result"></div> 

    </div> 
    <?php } ?> 
    </body> 
    </html> 

c'est le calculate.php:

<?php 

    // Check the sum of the charachters of the message entered by user 
    // Assumption - only white space is not a charachter  
    $feel = "Sorry"; 
    $count = 0; 
    $message = $_POST["message"]; 
    $string = trim($message); 

    for ($i=0; $i<strlen($string); $i++) { 
      // ord() - cast to ascii 
      $count += ord($string[$i]); 
      } 
    if ($count%2==0) { 
     $feel = "Glad"; 
    } 

    $result = $feel . " to hear that ..."; 

    // Server side date for the result 
    $date = date('d/m/Y H:i'); 

    $form = " 
    <div class=\"content2\"> 
     <form action=\"practicalTask.php\" method=\"post\"> 
      <div class=\"firstLine\"> 
      <label for=\"message\">Message</label> <div class=\"time\"> Time </div> 
      </div> 
      <div class=\"secondLine\"> 
       <input type=\"text\" name=\"message\" value=" . $message . "> 
       <input type=\"submit\" value=\"OK\" /> 
       <div id=\"time\"> " . $date . "</div> 
      </div> 
     </form> 
    </div>"; 
    echo $form; 

    $resultLine = "<div class=\"firstLine\"> Result </div> 
       <div class=\"resultLine\"> 
        <div class=\"result\"> 
         <p class=\"" .$feel . "\">" . $result . "</p> 
        </div> 
        <div class=\"timestamp\"> 
         <p class=\"" . $feel . "\">" . $date . "</p> 
        </div> 
       </div>";  
    echo $resultLine; 

    echo "<div class=\"margintop\"> <img src=\"sepsmall.jpg\" /> </div>"; 
?> 

Je veux changer la façon dont il fonctionne, en ordonne que la nouvelle ligne (où j'écris les nouvelles choses) sera en bas. J'ai essayé de nombreuses façons, ils ont tous échoué.

Merci beaucoup ..

+0

Cela semble être la tâche triviale de déplacer une balise HTML d'un endroit à un autre. Qu'avez-vous essayé, et de quelle manière cela a-t-il échoué? – Guffa

+0

Lisez les HEREDOC de PHP, http://php.net/heredoc, qui vous permettraient de sortir votre code HTML sans avoir à user votre barre oblique inverse. –

+0

J'ai essayé de déplacer la balise id = "result" au début, avant le formulaire, mais cela a fait beaucoup de problèmes, les variables ont changé et plus ... –

Répondre

0

D'accord, je ne suis pas complètement sûr de comprendre ce dont vous avez besoin, mais voici comment je l'habitude d'éviter ces problèmes positions:

Au lieu de:

$(function() { 
     $(".button").click(function() { 

      var dataString = "message= "+$('#message').val(); 
      $.ajax({ 
      type: "POST", 
      url: "calculate.php", 
      data: dataString, 
      success: function(data) { 
       $('#result').append("<div id='message'> "+ data +" </div>"); 
      } 
      }); 
     return false; 
     }); 
    }); 

vous pouvez avoir. $ (function() { $ ("bouton") cliquez sur (function() {

 var dataString = "message= "+$('#message').val(); 
     $.ajax({ 
     type: "POST", 
     url: "calculate.php", 
     data: dataString, 
     success: function(data) { 
      $('#result').html(data); 
     } 
     }); 
    return false; 
    }); 
}); 

Et de rendre le tout au serveur lvl, en PHP, ce qui signifie essentiellement inclure "<div id="message"></div>" dans votre retour PHP. Ce n'est pas la chose la plus astucieuse au monde, mais je n'ai jamais de problèmes de positionnement lorsque je redirige le contenu de PHP via jQuery/Ajax.

Questions connexes