Working with jQuery and Silex as RestFull Resource provider

The previous post was about how to use AngularJS resources with Silex. AngularJS is great and when I need to switch back to jQuery it looks like I go back 10 years in web development, but business is business and I need to live with jQuery too. Because of that this post is about how to use the Silex RestFull resources from the previous post, now with jQuery. Let’s start:

We’re going to write a simple javascript object to handle the RestFull resource using jQuery:

var Resource = (function (jQuery) {
    function Resource(url) {
        this.url = url;

    Resource.prototype.query = function (parameters) {
        return jQuery.getJSON(this.url, parameters || {});

    Resource.prototype.get = function (id, parameters) {
        return jQuery.getJSON(this.url + '/' + id, parameters || {});

    Resource.prototype.remove = function (id, parameters) {
        return jQuery.ajax({
            url:this.url + '/' + id,
            xhrFields:JSON.stringify(parameters || {}),

    Resource.prototype.update = function (id, parameters) {
        return + '/' + id, JSON.stringify(parameters || {}), 'json');

    Resource.prototype.create = function (parameters) {
        return, JSON.stringify(parameters || {}), 'json');

    return Resource;

As you can see the library returns jQuery ajax promises, so we can use done() and error() callbacks to work with the server’s data.

Here our application example:

var host = document.location.protocol + '//' +;
var resource = new Resource(host + '/api/message/resource');

resource.create({ id: 10, author: 'myname', message: 'hola'}).done(function (data) {
    console.log("create element", data);

resource.query().done(function (data) {
   console.log("query all", data);

resource.update(10, {message: 'hi'}).done(function (data) {
    console.log("update element 1", data);

resource.get(10).done(function (data) {
    console.log("get element 1", data);

resource.remove(10).done(function (data) {
    console.log("remove element 1", data);

resource.query().done(function (data) {
    console.log("query all", data);

And that’s all. You can get the full code of the example from my github account


5 thoughts on “Working with jQuery and Silex as RestFull Resource provider

  1. would be interesting to generalize the resources with a predefined map from the api documentation, then also show some examples on how to handle the errors with .error() as it was mentioned.

    1. In my last projects I’m working with RESFull services with predifined standard HTTP actions. We we switch our mind from “verbs for actions” to “noums with predefined actions”, life becomes much easier.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.