how to call php functions from a javascript function to access a database

Question

hi, how do you call php function that is in a different file from a javascript function.

I have a javascript function that recieves a variable frm an onclick function. The varaible is an id that I will use to retrieve data from mysql database. The variable is then pass on to php function that will access the database to get the data and return back to my js function for display, but it does seem to be working. how can i get it to work?? I am using codeigniter php.

here is code

javascript in a different file called divUpdate.php

<script type="text/javascript">

function changeDiv(venueID){
    //retrieveData(venueID) is php function from venue_model.php
    var dest = retrieveData(venueID);
    document.getElementById('venue_description').innerHTML=dest;


}
</script>

---where the onclick function calls the javascript above ----

<li><a href="#self" class="menulink" class=&{ns4class};
                   onClick="changeDiv(\''.
                     $venue_details->VenueID.

                   '\')">;

--- function the is called from javascript above this is in the model(codeigniter)--

function retrieveData($venueID){

$query = $this->db->query("SELECT * FROM venue WHERE VenueID = '$venueID' ");
 echo $query;

}

Answer 1

What you are looking for is "AJAX" - try searching for a tutorial on google. Also, you'll find it a lot easier to perform AJAX requests by using a JavaScript library like jQuery.

Here's jQuery AJAX function: http://api.jquery.com/jQuery.ajax/

Answer 2

Use AJAX as already suggested. Using Jquery you will get this fixed with ease.

You will need to create a controller to access your AJAX calls. I - simply enough - created the ajax controller like this:

<?php

  class Ajax extends Controller
  {
    public function index()
    {
      $this->output->set_output("This is the AJAX Controller");
    }

    public function get_venue_description( $venueId )
    {
      $this->load->model('yourmodel');
      $data = $this->yourmodel->retrieveData($venueId);
      $this->output->set_output($data);
    }
  }

?>

Then your JavaScript, after implementing jQuery, should look something like this:

<script type="text/javascript">
function changeDiv(venueID)
{
  $.get('/ajax/get_venue_description/' + venueId, function(data) {
    $('#venue_description').html(data);
  });
}
</script>

I haven't tested it, but I hope you get the idea.