Get data from MySQL using AJAX

Question

I need to take an input (date) from a form in a php file, and use the date variable to select data from a mysql database and return an array in the same php file without refreshing the page. Right now, I have 3 files: index.php, global.js, and date.php

index.php takes an input (a date, in this case)

Date: <input type="text" id="date">
  <input type="submit" id="date-submit" value="Submit">
  <div id="date-data"></div>
  <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script src="js/global.js"></script>

global.js listens for a click on the submit button and posts the input (date) to date.php

$('input#date-submit').on('click', function() {
    var date = $('input#date').val();
    $.post('../ajax/date.php', {date: date}, function(data) {
        $('div#date-data').html(data);
        alert(data);
    });

});

date.php takes the date and queries the mysql database to return an array. This array needs to be passed back to index.php but I can't figure out how to do it.

<?php 

$con = mysql_connect('localhost', 'root', 'pass');
mysql_select_db('gymflow', $con);
  $date = $_POST['date'];
  $query = mysql_query("SELECT * FROM table WHERE `date` = $date");
    $values = array();

  while ($row = mysql_fetch_array($query))
  {
    $values[] = $row['utilization'];
  }
echo json_encode($values);

?>

Ideally, I need to be able to have the $values variable from date.php passed to a $values variable in index.php

There must be an easier way to do this...

Do not use the mysql_* functions in your code. These functions are no longer maintained and will be deprecated for good in PHP 5.5. Instead, you should use either MySQLi or PDO. Don't know which to use? This article should help. — Jonah Bishop
– Jonah Bishop, Commented Dec 25, 2012 at 12:27
The way you get back the output of data.php in index.php is by the AJAX callback. That will update the page. What are you asking for? — Raffaele
– Raffaele, Commented Dec 25, 2012 at 12:28
It returns a blank array...i think this is because of some problem with syntax in $query = mysql_query("SELECT * FROM past_traffic WHERE 'date' = $date"); because when i hard code the date, i get an array with data. The 2nd problem is I don't know how to get this array into a variable in the callback...right now I just have it printed inside a div. — user1137778
– user1137778, Commented Dec 25, 2012 at 12:37

Raffaele · Accepted Answer · 2012-12-25 12:32:58Z

3

The purpose of your AJAX call is to not refresh index.php, and instead deliver the result of data.php straight into the first page. You can modify the DOM via the javascript callback, and should make other database-requests in data.php. There is no purpose in letting index.php aware of the output of data.php, simply because when the Javascript call is made, your first page has already been processed and sent to the client and possibly already rendered in the browser window.

If you need to know the input value in subsequent requests to index.php you may store in the value in the user's session.

answered Dec 25, 2012 at 12:32

Raffaele

20.9k7 gold badges50 silver badges90 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user1137778 Over a year ago

I can get the array printed inside the div, but I want to be able to use it as a variable $values in index.php. After the callback, I need $values to exist in index.php because I call a include a separate php file that draws a css graph based on the $values array.

Pankrates Over a year ago

That is just the point, you can not include the $values variable in index.php because it never exists. However since you do manage to get the required data from the callback you can use javascript to manipulate the database extracts and draw the css graph. You can not use php

user1137778 Over a year ago

Is there any way to save the date input in index.php to a variable in the same file?

Raffaele Over a year ago

No, but you can store it in the session scope. Be aware that the lifecycle of a PHP script is a fraction of a second: as soon as the last line of your script is reached, it dies. So there's no way to set its variables, but you can use sessions (or database, or a file, or whatever) to persist input across multiple requests

Collectives™ on Stack Overflow

Get data from MySQL using AJAX

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related