AJAX calls using jQuery

For making ajax call with javascript firstly we need to crate XMLHttpRequest object that is browser dependent then can proceed for ajax call. But jquery has made the things simple as well as with powerful . jQuery provides a rich set of handy methods you can use to Ajaxify your web pages. jQuery provides wrapper methods that shield you from the inner mechanisms of an AJAX request as:

1. GET Request method : jQuery.get( url, [data], [callback], [type] )
2. POST Request method : jQuery.post( url, [data], [callback], [type] )
3. Get JSON : jQuery.getJSON( url, [data], [callback] )
4. AJAX Start/End : jQuery.ajaxStart([callback]), jQuery.ajaxComplete([callback])
5. Serialize html form : serialize(), serializeArray()
6. jQuery.ajax()

1. GET Request method : Loads a remote page using HTTP GET request method. It allows a single callback function to be specified that will be executed when the request is complete (and only if the response has a successful response code).

jQuery.get( url, [data], [callback], [type] )

url: (String) The URL of the page to load.

data (Optional): (Map) Key/value pairs that will be sent to the server.

callback (Optional): (Function) A function to be executed whenever the data is loaded successfully.

type (Optional): (String) Type of data to be returned to callback function: “xml”, “html”, “script”, “json”, “jsonp”, or “text”.

2. POST Request method : 

Sends HTTP Post request.

jQuery.post( url, [data], [callback], [type] )

url: (String) The URL of the page to load.

data (Optional): (Map) Key/value pairs that will be sent to the server.

callback (Optional): (Function) A function to be executed whenever the data is loaded successfully.

type (Optional): (String) Type of data to be returned to callback function: “xml”, “html”, “script”, “json”, “jsonp”, or “text”.

3. Get JSON : 

JavaScript Object Notation (JSON) is a popular light weight format that can be used to get data from server. JSON format is easy to create from the server and easy to parse at client as it is the basic object representation in JavaScript. Normally the data that we get from AJAX is converted in JSON by calling eval () method of JavaScript. But the function provided by JQuery handles this internally and provides direct JSON object as output.

jQuery.getJSON( url, [data], [callback] )

url: (String) The URL of the page to load.

data (Optional): (Map) Key/value pairs that will be sent to the server.

callback (Optional): (Function) A function to be executed whenever the data is loaded successfully.

4. AJAX Start/End : 

While making a sequence of AJAX requests one being dependent on returned data from other request's response in that case it is good to show a progress bar or image to user so that (s)he knows that something is going on. For such case ajax start/end method used.
ajaxStart() method registers a function handler that will be called by jQuery internally whenever an AJAX call is made. If already a request is active than the handler is not called. We can use this method to register a handler function that will display our progress bar.

Similarly ajaxComplete() method can be used to register a handler function which gets called by jQuery when an AJAX request get completed and any other active request are not in progress.

5. Serialize html form :

While submitting a form using AJAX, one has to create a input string that contains the value of all the input elements on the screen. It is very difficult to create this string if your form is very big. Hence we can use jQuery’s serialize() and serializeArray() method to do so.

serialize()
Serializes a set of input elements into a string of data. Serialize is typically used to prepare user input data to be posted to a server. The serialized data is in a standard format that is compatible with almost all server side programming languages and frameworks. In order to work properly serialize requires that form fields have a name attribute. Having only an id will not work.
This value can be sent to server by an AJAX call.

serializeArray()
serializeArray() does the similar job. Except it creates JSON output.

6. jQuery.ajax()

If you need greater flexibility, the full-blown $.ajax() function offers a great number of settings.

For instance, let's say you want to retrieve a list of programming languages from the XML document you used in the previous example. You might want to specify the following options:

1. the request must be an HTTP GET;
2. the page from which the result is returned must not be in the browser's cache;
3. the response returned by the server is of data-type XML;
4. the request is made in html;
5. there must be a function that handles the returned result if all goes well;
6. and, finally, there must be a function that handles errors in case the request is not successful.

jQuery - AJAX Events

Local Events:

These are callbacks that you can subscribe to within the Ajax
request object.

$.ajax({ beforeSend: function(){ // event handling }, complete: function(){ // event handling } // ...... });

Global Events :

These events are broadcast to all elements in the DOM, triggering any
handlers which may be listening. You can listen for these events like so:

$("#loading").bind("ajaxSend", function(){ $(this).show(); }).bind("ajaxComplete", function(){ $(this).hide(); });

Global events can be disabled, for a particular Ajax request, by
passing in the global option, like so:

$.ajax({ url: "MyPage.html", global: false, // ... });

Events:

Below is the full list of Ajax events, where the ajaxStart and ajaxStop events are
 events that relate to all Ajax requests together.

• ajaxStart (Global Event)
  This event is broadcast if an Ajax request is started and no other
  Ajax requests are currently running.
  • beforeSend (Local Event)
    This event, which is triggered before an Ajax request
    is started, allows you to modify the XMLHttpRequest object
    (setting additional headers, if need be.)
  • ajaxSend (Global Event)
    This global event is also triggered before the request is run.
  • success (Local Event)
    This event is only called if the request was successful (no errors
     from the server, no errors with the data).
  • ajaxSuccess (Global Event)
    This event is also only called if the request was successful.
  • error (Local Event)
    This event is only called if an error occurred with the request
     (you can never have both an error and a success callback with a request).
  • ajaxError (Global Event)
    This global event behaves the same as the local error event.
  • complete (Local Event)
    This event is called regardless of if the request was successful,
    or not. You will always receive a complete callback, even for
    synchronous requests.
  • ajaxComplete (Global Event)
    This event behaves the same as the complete event and will be
    triggered every time an Ajax request finishes.
• ajaxStop (Global Event)
  This global event is triggered if there are no more Ajax requests being processed.

HttpCookieMode enumerations

Design Principles

SOLID Principles:
SRP:(single responsibility principle)
OCP:(Open Close Principle)
LSP: (Liskov substitution principle - Design By Contract)
ISP:(Interface-segregation principle)
DIP:(Dependency inversion principle)

Inheritance --> is - a
Composition --> part - of
Aggregation --> has - a

LINQ

Aggregate	Conversion	Ordering	Partitioning	Sets
Aggregate	Cast	OrderBy	Skip	Concat
Average	OfType	ThenBy	SkipWhile	Distinct
Count	ToArray	Descending	Take	Except
Max	ToDictionary	Reverse	TakeWhile	Intersect
Min	ToList			Union
Sum	ToLookup
	ToSequence

Ajax Frameworks Types

Ajax Frameworks Types

Client Side vs. Server Side Frameworks
 

Two types of Ajax based frameworks used in the web programming nowadays: 

1. Server-side Framework 

2. Client-side Framework. 

Server-side framework is where the code executed on the Web server is considered as Server-side code  and it is installed inside the server.

Client-side framework is where code is executed on the user’s browse.

Internet is an extremely wide area and because of this both the server-side and client –side programmers may not be in the contact and performs their work separately. Both the server-side and client-side functions differently and the code used in the frameworks also varies. The code of both the frameworks has its own pros and cons that suite to different sorts of developers.

Now the question arises, what is the Server-side framework and what is Client-side? In this article, you will get the answer of both these queries. You will also learn about what are the advantages and disadvantages of both these frameworks.

Server Side Framework
The framework that is installed inside the server is known as Server-side framework. The coding of server-side framework is actually not created in JavaScript but it is the same language that API provided for server-side framework. So, it is not mandatory for the developers to be skilled in JavaScript for server-side framework programming. Nearby all the frameworks in server-side accepts the coding of developers and automatically translates it into Ajax when user accesses the website.

Server-side framework can also be used for installing the specific functions from the library to translate and accessed effectively. The server-side framework exactly provides the desired functions and the library needed for developer to render the specific buttons and information in Ajax based website. The developers have to only customize the code during creating the program. Moreover, the server-side framework responds better because it handles a large number of user communications without intervention of server.

Google Web Toolkit (GWT) might be an excellent example of server-side framework that is used as a normal Java Swing kind of programming on the server side in web pages using the GWT API. The other server side frameworks are: Yahoo, Toolkit and DWR.

Server-side framework is basically used for server server-side programming that covers password protection, browser customization, form processing and building and displaying pages created from database.

Pros and Cons of Server Side Frameworks
There is no need for the developers to learn the extra language as server-side coding can be written in the existing language in which the server-side programmer is efficient.

Client Side Framework
As opposing the server-side, Client-side framework is accessed and executes within the user’s browsers. For creating Ajax based client-side framework, developers must be efficient enough in JavaScript as well as XML. Because Ajax-based client side website is fully depended upon Ajax and it also needs to a wide range of coding for different browsers.

The different uses of framework for different browsers make the Ajax client-side programming very complex. The frameworks written for Mozilla cannot be executed in Internet Explorer if XMLHttpRequest has not been defined and implemented for the Internet explorer too.

The Request XMLHttpRequest performs like a bridge between the server and the client. The developers have to generate different coding for different platforms to perform it successfully. That’s why the developers must have the knowledge about which browser has been used by his client; otherwise the developer has to develop several customize client-side framework for running their own platforms.

Through Client-side framework, users can execute any technology that supports user’s browser. In Client-side framework, users can modify several features besides codes without sending information to web server.

In the Client-side framework, user can handle multiple asynchronous request, can detect easily error handling and exceptions and can mix and match widget facilities to get extra flexibility in the programming. (Widgets are small interfaces or components that can be integrated with an application easily through client side framework)

Client-side framework is used in online games, customizing the display without reloading the page and getting data about the user’s screen or browser. The examples of client-side framework are Prototype, DOJO Toolkit, Rico, Script.aculo.us and many more.

Pros and Cons of Client Side Frameworks

Client-side framework is more flexible than server-side due to multi-handing frameworks, easily error handling and exceptions while the adding of widgets makes it extra-flexible.

Static Class

1. Static Class cannot be instantiated unlike the unstatic class. You should directly access its Method via the ClassName.MethodName
   
   
2. A Program can't tell when it is going to load static class but its definitely loaded before the call.
   
   
3. A Static class will always have the static constructor and its called only once since after that its in the memory for its lifetime.
   
   
4. A Static class can contain only static members. So all the members and functions have to be static.
   
   
5. A Static class is always sealed since it cannot be inherited further. Further they cannot inherit form any other class (except Object)