Learn ASP.NET AJAX in 5 Minutes

Learn ASP.NET AJAX in 5 Minutes ©Mohamed ATHIMNI [email_address] 02/2012 – Version 1.0.0 Learn ASP.NET AJAX in 5 Minutes

Basic OOP Programming Using ASP.NET AJAX Learn ASP.NET AJAX in 5 Minutes

1. Declaring Namespaces Type.registerNamespace (‘Athimni.ASP.Net.AJAX’); Learn ASP.NET AJAX in 5 Minutes

2. Checking For Namespaces Type.isNamespace (‘Athimni.ASP.Net.AJAX’); Return true / false Learn ASP.NET AJAX in 5 Minutes

3. Declaring Classes Athimni.ASP.Net.AJAX.PersonClass = function (FirstName, LastName) { this.m_FirstName = FirstName; this.m_LastName = LastName; } Athimni.ASP.Net.AJAX.PersonClass .prototype = { GetFirstName: function () { return this.m_FirstName; }, GetLastName: function() { return this.m_LastName; } } Athimni.ASP.Net.AJAX.PersonClass .registerClass (‘Athimni.ASP.Net.AJAX.PersonClass’); Learn ASP.NET AJAX in 5 Minutes

4. Using Classes var MePerson = new Athimni.ASP.Net.AJAX.PersonClass(‘ATHIMNI’, ‘Mohamed’); MePerson.GetFirstName(); Learn ASP.NET AJAX in 5 Minutes

5. Checking For Classes Type.isClass(‘Athimni.ASP.Net.AJAX.PersonClass’); Return true / false Learn ASP.NET AJAX in 5 Minutes

6. Inheritance Athimni.ASP.Net.AJAX.DeveloperClass = function(DevFirstName, DevLastName, DevProgrammingLanguage) { Athimni.ASP.Net.AJAX.DeveloperClass .initializeBase (DevFirstName, DevLastName); this.m_ DevProgrammingLanguage = DevProgrammingLanguage } Athimni.ASP.Net.AJAX. DeveloperClass .registerClass (‘Athimni.ASP.Net.AJAX.DeveloperClass’, Athimni.ASP.Net.AJAX.PersonClass ); Learn ASP.NET AJAX in 5 Minutes

7. Inheritance : Calling Base Method Athimni.ASP.Net.AJAX.DeveloperClass .prototype = { AboutMe: function() { var lastName = Athimni.ASP.Net.AJAX.DeveloperClass .callBaseMethod (this, « GetLastName »)); return lastName; } Learn ASP.NET AJAX in 5 Minutes

8. Reflexion if (Athimni.ASP.Net.AJAX.PersonClass .isInstanceOfType (MePerson) == true) { alert(‘MePerson is of type PersonClass.’); } if (Athimni.ASP.Net.AJAX. Athimni.ASP.Net.AJAX.DeveloperClass .inheritsFrom (Athimni.ASP.Net.AJAX.PersonClass) == true) { } Learn ASP.NET AJAX in 5 Minutes

9. Declaring Interfaces Athimni.ASP.Net.AJAX.ISayHelloWorld = function() { throw Error.notImplemented(); } Athimni.ASP.Net.AJAX.ISayHelloWorld .prototype = { SayHelloWorld = function () { throw Error.notImplemented(); } } Athimni.ASP.Net.AJAX.ISayHelloWorld. registerInterface (‘Athimni.ASP.Net.AJAX.ISayHelloWorld’); Learn ASP.NET AJAX in 5 Minutes

10. Using Interfaces Athimni.ASP.Net.AJAX.NewClassWithInterface = function(Message) { this.m_Message = Message; } Athimni.ASP.Net.AJAX.NewClassWithInterface .prototype = { SayHelloWorld = function () { alert(m_Message); } } Athimni.ASP.Net.AJAX. NewClassWithInterface. registerClass (‘Athimni.ASP.Net.AJAX.NewClassWithInterface’,Athimni.ASP.Net.AJAX.ISayHelloWorld); Learn ASP.NET AJAX in 5 Minutes

11. Declaring Enumerations/Flags Athimni.ASP.Net.AJAX.PersonTypeEnum = function() { throw Error.invalidOperation(); } Athimni.ASP.Net.AJAX.PersonTypeEnum .prototype = { MEN: 1, WOMEN: 2 } } Athimni.ASP.Net.AJAX. PersonTypeEnum. registerEnum (‘Athimni.ASP.Net.AJAX.PersonTypeEnum’, true /* Optional: Supporting Flags Bitwise */ ); Learn ASP.NET AJAX in 5 Minutes

12. Using Enumerations var PersonType = Athimni.ASP.Net.AJAX.PersonTypeEnum.MEN; alert (Athimni.ASP.Net.AJAX.PersonTypeEnum .toString( PersonType)); Learn ASP.NET AJAX in 5 Minutes

13. Where to call these things? function pageLoad(sender, args){ ... } Learn ASP.NET AJAX in 5 Minutes

14. Arrays var PersonArray = new Array(); Array .add (PersonArray, ‘Me’); Array .add (PersonArray, ‘You’); var boolValue = Array .contains (PersonArray, ‘Me’); // true var NewPersons = [‘He, She’]; Array .addRange (PersonArray, NewPersons); Array .Insert (PersonArra, 1, ‘Us’); Array .forEach (PersonArray, MyCallBakcMethod); Learn ASP.NET AJAX in 5 Minutes

14. Arrays var PersonArray = new Object PersonArray[« Me »] = « Mohamed »; PersonArray[« You »] = « Your LN »; for (var LiteralIndex in PersonArray) alert(PersonArray[LiteralIndex]); Learn ASP.NET AJAX in 5 Minutes

Using The ScriptManager In ASP.NET Learn ASP.NET AJAX in 5 Minutes

1. Adding Scripts References <asp:ScriptManager runat="server" ID="SM"> <Scripts> <asp:ScriptReference Path= " MyJavaScriptFile.js " /> </Scripts> </asp:ScriptManager> Learn ASP.NET AJAX in 5 Minutes

1. Adding Scripts References Remeber : Your file script should include these lines to be called by the ScriptManager: function identityFunction(arg) { return arg; } if(typeof('Sys') !=='undefined') Sys.Application.notifyScriptLoaded(); Learn ASP.NET AJAX in 5 Minutes

2. Adding Services References <asp:ScriptManager runat="server" ID="SM"> <Services> <asp:ServiceReference Path= " MyWebServiceFile.asmx " /> </Services> </asp:ScriptManager> Learn ASP.NET AJAX in 5 Minutes

2. Adding Services References Remember: Don’t forget to add [ScriptService] attribute to your C# or VB.NET service class. Learn ASP.NET AJAX in 5 Minutes

Using The WebRequest In ASP.NET AJAX Learn ASP.NET AJAX in 5 Minutes

1. Making WebRequest Call It’s a wrappr around XLHttpRequest object: function pageLoad() { var webRequest = new Sys.Net.WebRequest(); webRequest .set_url ("SayHello.aspx"); webRequest .add_completed (completedHandler); webRequest .invoke (); } function completedHandler(result, eventArgs) { if(result .get_responseAvailable() ) { alert(result .get_statusText() ); alert(result .get_responseData() ); // result.get_xml().xml } } Learn ASP.NET AJAX in 5 Minutes

1. Making WebRequest Call We can set the HTTP Verb also (GET, POST): function pageLoad() { var webRequest = new Sys.Net.WebRequest(); webRequest .set_url ("SayHello.aspx"); webRequest .set_httpVerb('POST') ; webRequest .set_body('To=MyName') ; webRequest .add_completed (completedHandler); webRequest .invoke (); } function completedHandler(result, eventArgs) { if(result. get_responseAvailable() ) { alert(result .get_statusText() ); alert(result .get_responseData() ); } } Learn ASP.NET AJAX in 5 Minutes

1. Making WebRequest Call We can set the Timeout : function pageLoad() { var webRequest = new Sys.Net.WebRequest(); webRequest .set_url ("SayHello.aspx"); webRequest .set_timeout(5000) ; webRequest .add_completed (completedHandler); webRequest .invoke (); } function completedHandler(result, eventArgs) { if(result .get_timedOut() ) { alert('Hi, It’s time out!'); } if(result. get_responseAvailable() ) { alert(result .get_statusText() ); alert(result .get_responseData() ); } } Learn ASP.NET AJAX in 5 Minutes

1. Making WebRequest Call We can set a User Context: function pageLoad() { var webRequest = new Sys.Net.WebRequest(); webRequest .set_url ("SayHello.aspx"); webRequest .set_userContext(‘Hi, I’m called for a defined purpose') ; webRequest .add_completed (completedHandler); webRequest .invoke (); } function completedHandler(result, eventArgs) { if(result. get_responseAvailable() ) { alert(result .get_webRequest() .get_userContext() ); } Remember: The WebRequest does not include the user context information in what is sent to the server. Instead, the data is stored locally and then made available during the callback. You can store complex JavaScript types without needing to worry about how they will be serialized for including in an HTTP request. This also keeps the request/response payload lighter. Learn ASP.NET AJAX in 5 Minutes

Using The WebRequestManager In ASP.NET AJAX Learn ASP.NET AJAX in 5 Minutes

1. Define a Timeout for all WebRequest function pageLoad() { Sys.Net.WebRequestManager .set_defaultTimeout (1000); var webRequest = new Sys.Net.WebRequest(); webRequest.set_url(‘SayHelloaspx'); webRequest.add_completed(completedHandler); webRequest.invoke(); } Learn ASP.NET AJAX in 5 Minutes

2. Global Web Request Handling function pageLoad() { Sys.Net.WebRequestManager. add_completedRequest (completedHandler); // remove_completedRequest var webRequest = new Sys.Net.WebRequest(); webRequest.set_url(‘SayHello.aspx'); var webRequest2 = new Sys.Net.WebRequest(); webRequest2.set_url(‘SayHello_2.aspx'); Sys.Net.WebRequestManager.executeRequest(webRequest2); Sys.Net.WebRequestManager.executeRequest(webRequest); } function completedHandler(result) { if(result.get_responseAvailable()) { $get('placeholder').innerHTML += "<br />" result.get_webRequest().get_url() + " returned: " + result.get_responseData (); } } Learn ASP.NET AJAX in 5 Minutes

3. Cancel the request before it is actually executed Sys.Net.WebRequestManager .add_invokingRequest ( invokingHandler ); function invokingHandler (sender, eventArgs) { if(eventArgs.get_webRequest().get_url() === ‘SayHello.aspx') { eventArgs .set_cancel (true); } } Learn ASP.NET AJAX in 5 Minutes

Using JSON In ASP.NET AJAX Learn ASP.NET AJAX in 5 Minutes

1. JSON Serialization using C# ASP.NET AlbumProxy.cs Learn ASP.NET AJAX in 5 Minutes

2. Deserializing JSON data using JS function pageLoad() { AlbumProxy.GetAlbumJSON(completionJSON); AlbumProxy.GetAlbumXML(completionXML); } function completionJSON(result) { var album = eval("(" + result + ")"); $get('placeholder').innerHTML = album var album2 = Sys.Serialization.JavaScriptSerializer.deserialize (result); // var objectWithDate = // Sys.Serialization.JavaScriptSerializer.deserialize(JSONstring); // var date = new Date(objectWithDate.dateProperty); $get('placeholder2').innerHTML = album2.Artist; } function completionXML(result) { var album = eval(result); $get('placeholder3').innerHTML = album.ReleaseYear; } Learn ASP.NET AJAX in 5 Minutes

Learn ASP.NET AJAX in 5 Minutes

More Related Content

What's hot

Viewers also liked

Similar to Learn ASP.NET AJAX in 5 Minutes

Recently uploaded

Learn ASP.NET AJAX in 5 Minutes