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,


view sourceprint?
001var client = new HttpClient();
002 
003 
004// Send a GET request
005client.getAsync('/Home/B');
006 
007 
008// Send a GET request with done callback
009client.getAsync('/Home/B', function (response) {
010    console.log('Get', response);
011});
012 
013 
014// Send a GET request with done and fail callback
015client.getAsync('/Home/B', function (response) {
016 
017},
018function (err) {
019 
020});
021 
022 
023// Send a DELETE request
024client.deleteAsync('/Home/B');
025 
026 
027// Send a DELETE request with done callback
028client.deleteAsync('/Home/B', function (response) {
029    console.log('Get', response);
030});
031 
032 
033// Send a DELETE request with done and fail callback
034client.deleteAsync('/Home/B', function (response) {
035 
036},
037function (err) {
038 
039});
040 
041 
042// Send a POST request with data
043client.postAsync('/Home/A', 'year=2008');
044 
045 
046// Send a POST request with data and done callback
047client.postAsync('/Home/A', 'year=2008', function (response) {
048});
049 
050 
051// Send a POST request with data, done and fail callback
052client.postAsync('/Home/A', 'year=2008', function (response) {
053},
054function (err) {
055 
056});
057 
058 
059// Send a POST request with data and content-type
060client.postAsync('/Home/A', 'year=2008', 'application/json');
061 
062 
063// Send a POST request with data, content-type and done callback
064client.postAsync('/Home/A', 'year=2008', 'application/json', function (response) {
065});
066 
067 
068// Send a POST request with data, content-type, done and fail callback
069client.postAsync('/Home/A', 'year=2008', 'application/json', function (response) {
070},
071function (err) {
072 
073});
074 
075 
076// Send a POST request with data, content-type and accept
077client.postAsync('/Home/A', 'year=2008', 'application/json', 'application/json');
078 
079 
080// Send a POST request with data, content-type, accept and done callback
081client.postAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
082});
083 
084 
085// Send a POST request with data, content-type, accept, done and fail callback
086client.postAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
087},
088function (err) {
089 
090});
091 
092 
093// Send a POST request with data and application/json content-type
094client.postAsJsonAsync('/Home/A', 'year=2008');
095 
096 
097// Send a POST request with data, application/json content-type and done callback
098client.postAsJsonAsync('/Home/A', 'year=2008', function (response) {
099});
100 
101 
102// Send a POST request with data, application/json content-type, done and fail callback
103client.postAsJsonAsync('/Home/A', 'year=2008', function (response) {
104},
105function (err) {
106 
107});
108 
109 
110// Send a POST request with data, application/json content-type and accept
111client.postAsJsonAsync('/Home/A', 'year=2008', 'application/json');
112 
113 
114// Send a POST request with data, application/json content-type, accept and done callback
115client.postAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
116});
117 
118 
119// Send a POST request with data, application/json content-type, accept, done and fail callback
120client.postAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
121},
122function (err) {
123 
124});
125 
126 
127// Send a POST request with data and application/xml content-type
128client.postAsXmlAsync('/Home/A', 'year=2008');
129 
130 
131// Send a POST request with data, application/xml content-type and done callback
132client.postAsXmlAsync('/Home/A', 'year=2008', function (response) {
133});
134 
135 
136// Send a POST request with data, application/xml content-type, done and fail callback
137client.postAsXmlAsync('/Home/A', 'year=2008', function (response) {
138},
139function (err) {
140 
141});
142 
143 
144// Send a POST request with data, application/xml content-type and accept
145client.postAsXmlAsync('/Home/A', 'year=2008', 'application/json');
146 
147 
148// Send a POST request with data, application/xml content-type, accept and done callback
149client.postAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
150});
151 
152 
153// Send a POST request with data, application/xml content-type, accept, done and fail callback
154client.postAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
155},
156function (err) {
157 
158});
159 
160 
161// Send a PUT request with data
162client.putAsync('/Home/A', 'year=2008');
163 
164 
165// Send a PUT request with data and done callback
166client.putAsync('/Home/A', 'year=2008', function (response) {
167});
168 
169 
170// Send a PUT request with data, done and fail callback
171client.putAsync('/Home/A', 'year=2008', function (response) {
172},
173function (err) {
174 
175});
176 
177 
178// Send a PUT request with data and content-type
179client.putAsync('/Home/A', 'year=2008', 'application/json');
180 
181 
182// Send a PUT request with data, content-type and done callback
183client.putAsync('/Home/A', 'year=2008', 'application/json', function (response) {
184});
185 
186 
187// Send a PUT request with data, content-type, done and fail callback
188client.putAsync('/Home/A', 'year=2008', 'application/json', function (response) {
189},
190function (err) {
191 
192});
193 
194 
195// Send a PUT request with data, content-type and accept
196client.putAsync('/Home/A', 'year=2008', 'application/json', 'application/json');
197 
198 
199// Send a PUT request with data, content-type, accept and done callback
200client.putAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
201});
202 
203 
204// Send a PUT request with data, content-type, accept, done and fail callback
205client.putAsync('/Home/A', 'year=2008', 'application/json', 'application/json', function (response) {
206},
207function (err) {
208 
209});
210 
211 
212// Send a PUT request with data and application/json content-type
213client.putAsJsonAsync('/Home/A', 'year=2008');
214 
215 
216// Send a PUT request with data, application/json content-type and done callback
217client.putAsJsonAsync('/Home/A', 'year=2008', function (response) {
218});
219 
220 
221// Send a PUT request with data, application/json content-type, done and fail callback
222client.putAsJsonAsync('/Home/A', 'year=2008', function (response) {
223},
224function (err) {
225 
226});
227 
228 
229// Send a PUT request with data, application/json content-type and accept
230client.putAsJsonAsync('/Home/A', 'year=2008', 'application/json');
231 
232 
233// Send a PUT request with data, application/json content-type, accept and done callback
234client.putAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
235});
236 
237 
238// Send a PUT request with data, application/json content-type, accept, done and fail callback
239client.putAsJsonAsync('/Home/A', 'year=2008', 'application/json', function (response) {
240},
241function (err) {
242 
243});
244 
245 
246// Send a PUT request with data and application/xml content-type
247client.putAsXmlAsync('/Home/A', 'year=2008');
248 
249 
250// Send a PUT request with data, application/xml content-type and done callback
251client.putAsXmlAsync('/Home/A', 'year=2008', function (response) {
252});
253 
254 
255// Send a PUT request with data, application/xml content-type, done and fail callback
256client.putAsXmlAsync('/Home/A', 'year=2008', function (response) {
257},
258function (err) {
259 
260});
261 
262 
263// Send a PUT request with data, application/xml content-type and accept
264client.putAsXmlAsync('/Home/A', 'year=2008', 'application/json');
265 
266 
267// Send a put request with data, application/xml content-type, accept and done callback
268client.putAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
269});
270 
271 
272// Send a PUT request with data, application/xml content-type, accept, done and fail callback
273 
274client.putAsXmlAsync('/Home/A', 'year=2008', 'application/json', function (response) {
275},
276function (err) {
277 
278});       

                    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.