A Simple jQuery HttpClient

        Introduction:


                    One of the reason why HttpClient getting popular day by day is that it is very simple to use and intuitive programming model. Due its simplicity, I have created a very simple HttpClient for jQuery(which abstract the jQuery.ajax calls) for myself and my friends, so that the programming model remain unified. But I think/feel that this may be useful and interesting for others. That's why I have created a package to share this library. In this article I will tell you how to use this simple jQuery HttpClient.


        Description:


                    First of all just install jquery.httpclient package from nuget and then include this in your view(or page). Now you can send ajax request in HttpClient library fashion. Here are examples that you can do using this library,


        
        var client = new HttpClient();


        // Send a GET request
        client.getAsync('/Home/B');


        // Send a GET request with done callback
        client.getAsync('/Home/B', function (response) {
            console.log('Get', response);
        });


        // Send a GET request with done and fail callback
        client.getAsync('/Home/B', function (response) {

        },
        function (err) {

        });


        // Send a DELETE request
        client.deleteAsync('/Home/B');


        // Send a DELETE request with done callback
        client.deleteAsync('/Home/B', function (response) {
            console.log('Get', response);
        });


        // Send a DELETE request with done and fail callback
        client.deleteAsync('/Home/B', function (response) {

        },
        function (err) {

        });


        // Send a POST request with data
        client.postAsync('/Home/A', 'year=2008');


        // Send a POST request with data and done callback
        client.postAsync('/Home/A', 'year=2008', function (response) {
        });


        // Send a POST request with data, done and fail callback
        client.postAsync('/Home/A', 'year=2008', function (response) {
        },
        function (err) {

        });


        // Send a POST request with data and content-type
        client.postAsync('/Home/A', 'year=2008', 'application/json');


        // Send a POST request with data, content-type and done callback
        client.postAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        });


        // Send a POST request with data, content-type, done and fail callback
        client.postAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a POST request with data, content-type and accept
        client.postAsync('/Home/A', 'year=2008', 'application/json', 'application/json');


        // Send a POST request with data, content-type, accept and done callback
        client.postAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
        });


        // Send a POST request with data, content-type, accept, done and fail callback
        client.postAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a POST request with data and application/json content-type
        client.postAsJsonAsync('/Home/A', 'year=2008');


        // Send a POST request with data, application/json content-type and done callback
        client.postAsJsonAsync('/Home/A', 'year=2008', function (response) {
        });


        // Send a POST request with data, application/json content-type, done and fail callback
        client.postAsJsonAsync('/Home/A', 'year=2008', function (response) {
        },
        function (err) {

        });


        // Send a POST request with data, application/json content-type and accept
        client.postAsJsonAsync('/Home/A', 'year=2008', 'application/json');


        // Send a POST request with data, application/json content-type, accept and done callback
        client.postAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        });


        // Send a POST request with data, application/json content-type, accept, done and fail callback
        client.postAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a POST request with data and application/xml content-type
        client.postAsXmlAsync('/Home/A', 'year=2008');


        // Send a POST request with data, application/xml content-type and done callback
        client.postAsXmlAsync('/Home/A', 'year=2008', function (response) {
        });


        // Send a POST request with data, application/xml content-type, done and fail callback
        client.postAsXmlAsync('/Home/A', 'year=2008', function (response) {
        },
        function (err) {

        });


        // Send a POST request with data, application/xml content-type and accept
        client.postAsXmlAsync('/Home/A', 'year=2008', 'application/json');


        // Send a POST request with data, application/xml content-type, accept and done callback
        client.postAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        });


        // Send a POST request with data, application/xml content-type, accept, done and fail callback
        client.postAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data
        client.putAsync('/Home/A', 'year=2008');


        // Send a PUT request with data and done callback
        client.putAsync('/Home/A', 'year=2008', function (response) {
        });


        // Send a PUT request with data, done and fail callback
        client.putAsync('/Home/A', 'year=2008', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data and content-type
        client.putAsync('/Home/A', 'year=2008', 'application/json');


        // Send a PUT request with data, content-type and done callback
        client.putAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        });


        // Send a PUT request with data, content-type, done and fail callback
        client.putAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data, content-type and accept
        client.putAsync('/Home/A', 'year=2008', 'application/json', 'application/json');


        // Send a PUT request with data, content-type, accept and done callback
        client.putAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
        });


        // Send a PUT request with data, content-type, accept, done and fail callback
        client.putAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data and application/json content-type
        client.putAsJsonAsync('/Home/A', 'year=2008');


        // Send a PUT request with data, application/json content-type and done callback
        client.putAsJsonAsync('/Home/A', 'year=2008', function (response) {
        });


        // Send a PUT request with data, application/json content-type, done and fail callback
        client.putAsJsonAsync('/Home/A', 'year=2008', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data, application/json content-type and accept
        client.putAsJsonAsync('/Home/A', 'year=2008', 'application/json');


        // Send a PUT request with data, application/json content-type, accept and done callback
        client.putAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        });


        // Send a PUT request with data, application/json content-type, accept, done and fail callback
        client.putAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data and application/xml content-type
        client.putAsXmlAsync('/Home/A', 'year=2008');


        // Send a PUT request with data, application/xml content-type and done callback
        client.putAsXmlAsync('/Home/A', 'year=2008', function (response) {
        });


        // Send a PUT request with data, application/xml content-type, done and fail callback
        client.putAsXmlAsync('/Home/A', 'year=2008', function (response) {
        },
        function (err) {

        });


        // Send a PUT request with data, application/xml content-type and accept
        client.putAsXmlAsync('/Home/A', 'year=2008', 'application/json');


        // Send a put request with data, application/xml content-type, accept and done callback
        client.putAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        });


        // Send a PUT request with data, application/xml content-type, accept, done and fail callback

        client.putAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
        },
        function (err) {

        });

                    In the above example we are sending GET, POST, PUT and DELETE request in similar way that we do with HttpClient library. The source code of simple jQuery HttpClient is available at github.


        Summary:


                    In this article, I showed you a simple jQuery HttpClient which help you to send ajax request in HttpClient library fashion. I have done this for myself for making the programming model unified in javascript with HttpClient library. Hopefully you will enjoy my this article too.



3 Comments

Comments have been disabled for this content.