#reqwest

A small, easy to use, open AJAX lib

###Version: 07/2012

###Size: Normal: 11KB
Minified: 6KB

###you can use it under the terms of: MIT license

###the following Browser are supported: IE6+
Chrome 1+
Safari 3+
Mobile Safari 3+
Firefox 1+
Opera

###this is a project from: Original: Dustin Diaz
this fork: Simon Waldherr

###Demo: simon.waldherr.eu/projects/reqwest/

API

reqwest('path/to/html', function (resp) {
  qwery('#content').html(resp)
})

reqwest({
    url: 'path/to/html'
  , method: 'post'
  , data: { foo: 'bar', baz: 100 }
  , success: function (resp) {
      qwery('#content').html(resp)
    }
})

reqwest({
    url: 'path/to/html'
  , method: 'get'
  , data: { [ name: 'foo', value: 'bar' ], [ name: 'baz', value: 100 ] }
  , success: function (resp) {
      qwery('#content').html(resp)
    }
})

reqwest({
    url: 'path/to/json'
  , type: 'json'
  , method: 'post'
  , error: function (err) { }
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
})

reqwest({
    url: 'path/to/json'
  , type: 'json'
  , method: 'post'
  , contentType: 'application/json'
  , headers: {
      'X-My-Custom-Header': 'SomethingImportant'
    }
  , error: function (err) { }
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
})

// Uses XMLHttpRequest2 credentialled requests (cookies, HTTP basic auth) if supported

reqwest({
    url: 'path/to/json'
  , type: 'json'
  , method: 'post'
  , contentType: 'application/json'
  , crossOrigin: true
  , withCredentials: true
  , error: function (err) { }
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
})

reqwest({
    url: 'path/to/data.jsonp?callback=?'
  , type: 'jsonp'
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
})

reqwest({
    url: 'path/to/data.jsonp?foo=bar'
  , type: 'jsonp'
  , jsonpCallback: 'foo'
  , jsonpCallbackName: 'bar'
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
})

reqwest({
    url: 'path/to/data.jsonp?foo=bar'
  , type: 'jsonp'
  , jsonpCallback: 'foo'
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
  , complete: function (resp) {
      qwery('#hide-this').hide()
    }
})

Promises

reqwest({
    url: 'path/to/data.jsonp?foo=bar'
  , type: 'jsonp'
  , jsonpCallback: 'foo'
})
  .then(function (resp) {
    qwery('#content').html(resp.content)
  }, function (err, msg) {
    qwery('#errors').html(msg)
  })
  .always(function (resp) {
    qwery('#hide-this').hide()
  })

reqwest({
    url: 'path/to/data.jsonp?foo=bar'
  , type: 'jsonp'
  , jsonpCallback: 'foo'
})
  .then(function (resp) {
    qwery('#content').html(resp.content)
  })
  .fail(function (err, msg) {
    qwery('#errors').html(msg)
  })
  .always(function (resp) {
    qwery('#hide-this').hide()
  })

var r = reqwest({
    url: 'path/to/data.jsonp?foo=bar'
  , type: 'jsonp'
  , jsonpCallback: 'foo'
  , success: function () {
      setTimeout(function () {
        r
          .then(function (resp) {
            qwery('#content').html(resp.content)
          }, function (err) { })
          .always(function (resp) {
             qwery('#hide-this').hide()
          })
      }, 15)
    }
})

Browser support

• IE6+
• Chrome 1+
• Safari 3+
• Firefox 1+
• Opera

jQuery and Zepto Compatibility

There are some differences between the Reqwest way and the jQuery/Zepto way.

method

jQuery/Zepto use type to specify the request method while Reqwest uses method and reserves type for the response data type.

dataType

When using jQuery/Zepto you use the dataType option to specify the type of data to expect from the server, Reqwest uses type. jQuery also can also take a space-separated list of data types to specify the request, response and response-conversion types but Reqwest uses the type parameter to infer the response type and leaves conversion up to you.

JSONP

Reqwest also takes optional jsonpCallback and jsonpCallbackName options to specify the callback query-string key and the callback function name respectively while jQuery uses jsonp and jsonpCallback for these same options.

But fear not! If you must work the jQuery/Zepto way then Reqwest has a wrapper that will remap these options for you:

reqwest.compat({
    url: 'path/to/data.jsonp?foo=bar'
  , dataType: 'jsonp'
  , jsonp: 'foo'
  , jsonpCallback: 'bar'
  , success: function (resp) {
      qwery('#content').html(resp.content)
    }
})

// or from Ender:

$.ajax.compat({
  ...
})

If you want to install jQuery/Zepto compatibility mode as the default then simply place this snippet at the top of your code:

$.ajax.compat && $.ender({ ajax: $.ajax.compat });

Happy Ajaxing!