Calling PHP functions in Javascript using AJAX

Question

I have a javascript file and I want to call a function on the php server side and return the result back to the client side using ajax, but I am not sure how to make the request to the specific php function.

Here are my files:

The javascript file basically retrieves the username from the html form, and I want to send that username to php and check against the database for availability.

In something.js:

function check_availability()
{
    var username = $.trim(document.getElementById('usernameField').value);
    var xmlhttp= new XMLHttpRequest();

    // not sure how to make the request here to check_availability() under php
}

The PHP file will just check the username thats being passed from the js file against the database, if its available return true, else false.

In something.php:

    class Something_Model {
    private $data;
    private $table;

    public function __construct() {
        $this->data = new udata(DBSERVER, DBUSERNAME, DBPASSWORD, DBNAME);
    }

    # check for username availability
    public function check_availability()
    {
        // make the check here, but needs to retrieve username from js file
        echo "here";
    }
}

So, inside the Something_Model class, I want to make the check_availability() call from javascript, can someone give me an example to make this ajax call? Also, how do I return the result back to the javascript? Do I need to encode it as a JSON obj?

Thanks a lot.

Fenton · Accepted Answer · 2012-11-12 20:43:14Z

You can't call a function in PHP directly - but you can call a PHP page that in turn can call the PHP function. For example...

service.php

include_once('something.php');
$model = new Something_Model();
$model->check_availability();

something.js

function check_availability() {

    var request = new XMLHttpRequest();
    request.open('GET', 'http://yoursite/service.php', false);
    request.send();

    if (request.status === 200) {
      alert(request.responseText);
    }
}

I have used a really simple example of an XMLHttpRequest - this example actually blocks while the request is made. In reality you may want to use a callback and allow it to run asynchronously but I wanted to keep the answer as short as possible.

Quentin · Accepted Answer · 2012-11-12 20:39:29Z

You can't call a PHP function from client side JavaScript.

You can make an HTTP request to a URL.

That URL can be handled by PHP.

To call a function, it can be a PHP script that does nothing except define functions and call a function function. (Or it could check the query string and call a function based on the value of a pice of data in it, etc).

You can return the data in any format you like. JSON is a sensible format if you want to return structured data.

thedayofcondor · Accepted Answer · 2012-11-12 20:42:14Z

What you are trying to do is called "REST web service". In layman terms is a web page whose result is not really meant to be displayed as a web page, but to be retrieved programmatically, processed and visualised mostly by using technologies such as AJAX/javascript.

Unless your return type is very plain (in which case you can just return a string of text) if your result data type is complex the best way to make it parseable with javascript is to encode is as JSON object - so it can be saved as a variable which then allows you to retieve its components - look at http://php.net/manual/en/ref.json.php

pocesar · Accepted Answer · 2012-11-13 01:04:53Z

you may use phery library as @Rhs pointed out http://phery-php-ajax.net

Your code would look like this:

Phery::instance()->set(array(
  'check_availability' => array(new Something_Model, 'check_availability');
))->process();

Then you'll call it from your code

// rename put attribute name="username" on your field
var local_phery = $('#usernameField').phery();
local_phery.make('check_availability').bind('phery:json', function(event,data){
  // deal with username suggestions
});
local_phery.remote(); // call the check_availability PHP function

In your class, you'll have to do your alert/DOM manipulation

class Something_Model {
private $data;
private $table;

public function __construct() {
    $this->data = new udata(DBSERVER, DBUSERNAME, DBPASSWORD, DBNAME);
}

# check for username availability
public function check_availability($data)
{
    $r = new PheryResponse;

    if ($this->get(array('username'=> $data['username']))){
      $r->alert('Not available!');
      // Or something like using colorbox library, would be like $.colorbox({html: ''});
      $r->jquery()->colorbox(array('html' => 'Not available!'));
      $r->json($suggestions); // $suggestions would be an array with username suggestions
    } else {
      $r->alert('Available!');
    }
    // make the check here, but needs to retrieve username from js file
    return $r;
}
}

Collectives™ on Stack Overflow

Calling PHP functions in Javascript using AJAX

4 Answers 4

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Related