Why with ajax I can update mysql but cannot use value from mysql/php variable?

Question

All happens in one php file

HTML code

<td>
   <input type="text" name="date_day1" id="date_day1" 
      value="<?php echo $_POST['date_day1']?>" size="1">
</td>
<td>
   <input type="text" name="amount1" id="amount1" 
      value="<?php echo $_POST['amount1']?>" size="5"></td>

Then javascript

<script type="text/javascript">
  //cross-browser xmlHTTP getter
  function getHTTPObject() {
    var xmlhttp; // The variable that makes Ajax possible! 
                 //Global XMLHTTP Request object
    //Creating object of XMLHTTP in Internet Explorer
    try {
      XmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e) {
      try {
        XmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } 
      catch(oc) {
        XmlHttp = null;
      }
    }
    if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
      try {
        // Set var the new request Opera 8.0+, Firefox, Safari
        xmlhttp = new XMLHttpRequest();
      }//try {
      catch (e) {//if it fails move onto the next
        xmlhttp = false;
      }//catch (e) {
    }//if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {

    return xmlhttp;
  }//function getHTTPObject() {

  function init(){
    window.setInterval(autoSave,3000); // 15000=15 seconds
  }

  function autoSave(){
    var date_day1 = document.getElementById("date_day1").value;
    var amount1 = document.getElementById("amount1").value;
    var params = "date_day1="+date_day1+"&amount1="+amount1;
    var http = getHTTPObject();
    http.open("POST", window.location.href, true);
    http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    http.setRequestHeader("Content-length", params.length);
    http.setRequestHeader("Connection", "close");
    http.send(params);
  }
</script>

And php

$date_day1 = $_POST['date_day1'];
$amount1   = $_POST['amount1'];
$mysqli    = new mysqli($dbhost, $dbuser, $dbpass, $dbname);

if($_SERVER["REQUEST_METHOD"]=="POST"){
  if ($stmt = mysqli_prepare($mysqli, 
     "UPDATE 2_1_journal SET Amount = ? WHERE RecordDay = ? ") ) {

    $stmt->bind_param( 'ds', $amount1 , $date_day1 );
    $stmt->execute();

    echo $date_day1 .' date_day1 from update<br>';
    echo $amount1 .' amount1<br>';
  }    
}

So what happens. Javascript (ajax) without clicking button takes user input, send to php code. Php code updates mysql. That means that somehow without clicking submit button are created php variables to update ($amount1 , $date_day1)?

But why these variables do not exist latter? I want without page refresh (without clicking submit button) use variables. For example in input form as value=""

How to do that? As I understand need to use json? but from information I have found can not understand.... Can someon write step by step how with json pass user input (or value from mysql) to input value=""

Or may be some book/tutorial how all works (book/tutorial for dummies to understand)?

Thanks for answer. Will search again.... words: how to get mysql value with jquery? — user2232696, Apr 06 '13 at 18:50
SEE http://stackoverflow.com/questions/5143191/inserting-into-mysql-from-php-jquery-ajax — Grmn, Apr 06 '13 at 18:55
You need to make those variables static thats all , you are looking for retaining a variable after a request . — Aravind.HU, Apr 06 '13 at 18:57
Putting PHP Variables into Javascript requires json_encode(); and from javascript to PHP requires json_decode(); — Daryl Gill, Apr 06 '13 at 18:59

Freeman · Accepted Answer · 2013-04-06T19:06:35.957

Your php script should echo a json. For example, i have ajax.php:

<?php
$myVariable = $_POST['myVar'];
//Do something with database here

//Here goes whatever you want to pass back to your page
echo json_encode(array('result' => 'Done doing things', 'data' => $someData)).

// This outputs a json 
// {"result" : "Done doing things", "data" : "Contents of $someData"}

And then jQuery will process this. Where your html file is something like

<html><head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function() {

    $('.myButton').click(function(e) {
        e.preventDefault(); //Prevent the page from reloading
        $.post('ajax.php', function(data) {
            $('#myContent').html(data.result);  //Put the result into the div
        }, 'json');
    });
});
</script></head>

<body>
<div id="myContent">This text will be replaced</div>
<a href="#" class="myButton">Click Me</a>
</body>
</html>

Read here about jQuery post function. http://api.jquery.com/jQuery.post/

Don't forget to include the jQuery library (read the documentation thoroughly).

If you need the data to be not erased between calls, you can :

Pass it back in your json and store it in a javascript variable,
Store it in the session or cookie
Store it in the database

Thanks again. Only is it possible instead of
This text will be replaced
to use something like — user2232696, Apr 06 '13 at 19:43
This is not possible because any php code on this page only gets executed ONCE, and that's when the page loads for the first time. To change the appearance, text, etc in a page after it has loaded, you have to use javascript (and in this case we're using jquery which is a javascript library) — Freeman, Apr 06 '13 at 19:45

Why with ajax I can update mysql but cannot use value from mysql/php variable?

1 Answers1