Scribd
Upload
56 views

SynapseIndia DOTNET Development AJAX Client Library

SynapseIndia DOTNET Development AJAX Client Library SynapseIndia Drupal development, SynapseIndia Ecommerce development, SynapseIndia Sharepoint development, SynapseIndia PHP development, SynapseIndia Dotnet development,

Uploaded by

tarunsingh19866
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
56 views

SynapseIndia DOTNET Development AJAX Client Library

SynapseIndia DOTNET Development AJAX Client Library SynapseIndia Drupal development, SynapseIndia Ecommerce development, SynapseIndia Sharepoint development, SynapseIndia PHP development, SynapseIndia Dotnet development,

Uploaded by

tarunsingh19866
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 18

SynapseIndia DOTNET

Development AJAX Client Library


Type System : Class - Interface

ASP.NET
AJAXLibrary
Client LibraryType System:
Class-Interface
ASP.NET AJAX
Client
Type System
: Class
- Interface
Interfaces are a convenient way to define standard behaviors that other types can

implement .
An interface is a contract that states that the implementer of the interface must
provide all of the functionality specified in the interface.
The interface itself is only a specification and has no functionality of its own
Interface definitions follow the same pattern as creating classes
The function name is the name of the interface. The prototype of the function is
modified to add the interface members.
The convention in defining interface members is to throw Error.notImplemented for
each member, so any class that implements the interface then needs to override
the interface members to provide real implementations or the exception will be
thrown.

ASP.NET
AJAXLibrary
Client LibraryType System:
Class-Interface
ASP.NET AJAX
Client
Type System
: Class
- Interface
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>ASP.NET AJAX Interface</title>
<script type="text/javascript">
function pageLoad(sender, args)
{
Type.registerNamespace('Wrox.ASPAJAX.Samples');
Wrox.ASPAJAX.Samples.IProvideTrackInfo = function() {
throw Error.notImplemented();
}
Wrox.ASPAJAX.Samples.IProvideTrackInfo.prototype = {
get_trackCount: function() {
throw Error.notImplemented();
}
}
Wrox.ASPAJAX.Samples.IProvideTrackInfo.registerInterface
('Wrox.ASPAJAX.Samples.IProvideTrackInfo');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div> </div>
</form>
</body>
</html>

ASP.NET
AJAX Library
Client LibrarySystem:
Class-Enumeration
ASP.NET AJAX
Client
TypeType
System
: Class
Enumeration
The ASP.NET AJAX type system provides
for defining enumerations and a
specialized version of them used as
combinable flags.
Enums let you establish a set of possible
values

function pageLoad(sender, args) {


Type.registerNamespace('Wrox.ASPAJAX.Samples');
Wrox.ASPAJAX.Samples.MusicGenre = function() {
throw Error.invalidOperation();
}
Wrox.ASPAJAX.Samples.MusicGenre.prototype = {
Blues:
1,
Classical:
2,
Electronic:
3,
Folk:
4,
Industrial:
5,
Jazz:
6,
NewAge:
7,
HipHop:
8,
Rock:
9,
WorldFusion:
10
}
Wrox.ASPAJAX.Samples.MusicGenre.registerEnum
('Wrox.ASPAJAX.Samples.MusicGenre');
var genre =
Wrox.ASPAJAX.Samples.MusicGenre.Industrial;

alert(Wrox.ASPAJAX.Samples.MusicGenre.toString(ge
nre));
alert(genre ==
Wrox.ASPAJAX.Samples.MusicGenre.Industrial);

ASP.NET
AJAX
ClientLibraryAJAXClass
Base Class
Library
ASP.NET AJAX
Client
Library
AJAX Base
Library
Microsoft ASP.NET AJAX provides features that helps in creating client script and
integrate it into ASP.NET applications. This includes extensions to existing
ECMAScript (JavaScript) objects to give them the richness of .NET Framework
classes
The AJAX Library takes a familiar set of features from the Base Class Library of the
.NET Framework and brings it to JavaScript in the browser
Extensions to JavaScript base types provide additional functionality for these types.

Array Type Extensions

Boolean Type Extensions

Date Type Extensions

Error Type Extensions

Number Type Extensions

Object Type Extensions

String Type Extensions

ASP.NET AJAX Networking


ASP.NET AJAX Networking
The core of AJAX development is the ability to make asynchronous web service
calls from JavaScript code.
Major web browsers have included an XMLHttpRequest object for making HTTP

requests.
The XMLHttpRequest object is used to perform out-of-band communications with
the server for invoking web services, executing callbacks, and performing
partial page updates.
ASP.NET AJAX provides classes for managing web requests, processing responses,
and detecting errors. It also provides support for serializing objects formatted
as JSON (JavaScript Object Notation), which makes them readily usable in

JavaScript in the browser.


JSON is a standard serial format that is more lightweight than XML.

ASP.NET
AJAX NetworkingXMLHttpRequest
ASP.NET AJAX
Networking
XMLHttpRequest
Object Object
Remote Scripting:
To minimize the impact of page redraws, primitive forms of scripted remote
procedure calls (RPC) appeared around 1997. Microsoft, in particular, pioneered this

field with a technology called Remote Scripting (RS).


RS employed a Java applet to pull in data from a remote Active Server Pages (ASP)based URL. The URL exposed a contracted programming interface through a target
ASP page and serialized data back and forth through plain strings. On the client, a

little JavaScript framework received data and invoked a user-defined callback to


update the user interface via Dynamic HTML or similar techniques. RS worked on
both Internet Explorer 4.0 and Netscape Navigator 4.0 and older versions.

Microsoft replaced the Java applet with a Component Object Model (COM) object

named XMLHttpRequest and released most of the constraints on the


programming interface exposed by the remote URL.

ASP.NET
AJAX NetworkingXMLHttpRequest
ASP.NET AJAX
Networking
XMLHttpRequest
Object Object
Browsers generally place a new request when an HTML form is submitted
either via clientside script or through a user action such as a button click.
When the response is ready, the browser replaces the old page with the

new one
The out-of-band call is triggered via script by an HTML page event and is
served by a proxy component based on the XMLHttpRequest object

The proxy component sends a regular HTTP request and waits, either
synchronously or asynchronously, for it to be fully served. When the
response data is ready, the proxy invokes a user-defined JavaScript

callback to refresh any portion of the page that needs updating.

ASP.NET
AJAX NetworkingXMLHttpRequest
ASP.NET AJAX
Networking
XMLHttpRequest
Object Object
In Mozilla browsers XMLHttpRequest looks like a native JavaScript object and can
be instantiated through the classic new operator:
var proxy = new XMLHttpRequest();

When the browser is Internet Explorer, the XMLHttpRequest object is instantiated


using the ActiveXObject wrapper
var proxy = new ActiveXObject("Microsoft.XmlHttp");

XMLHttpRequest in Internet Explorer 7


var proxy = new XMLHttpRequest();
ASP.NET AJAX Extensions completely encapsulates this object and shields page
authors and application designers from it

ASP.NET
AJAX NetworkingXMLHttpRequest
ASP.NET AJAX
Networking
XMLHttpRequest
Object Object

The XMLHttpRequest object is designed to perform one key


operation: sending an HTTP request. The request can be
sent either synchronously or asynchronously.
interface XMLHttpRequest {
function onreadystatechange;
readonly unsigned short readyState;
void open(string method, string url);
void open(string method, string url, bool async);
void open(string method, string url, bool async, string user);

void open(string method, string url, bool async,


string user, string pswd);
void setRequestHeader(string header, string value);
void send(string data);
void send(Document data);
void abort();
string getAllResponseHeaders();

string getResponseHeader(string header);


string responseText;
Document responseXML;
unsigned short status;
string statusText;
};

ASP.NET
AJAX NetworkingXMLHttpRequest
Object-Example
ASP.NET AJAX
Networking
XMLHttpRequest
Object
- Example
(Time.aspx) is a web page that returns the server time to its caller. It
takes no parameters and returns a string .
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Time Page</title>
<script runat="server">
protected override void OnLoad(EventArgs e) {
base.OnLoad(e);
Response.Write("Server Time:"+DateTime.Now.ToUniversalTime());
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>

ASP.NET
AJAX NetworkingXMLHttpRequest
Object-Example
ASP.NET AJAX
Networking
XMLHttpRequest
Object
- Example
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Networking using XMLHttpRequestObject</title>
<script type="text/javascript">
var xmlhttp;
function pageLoad() {
if(window.ActiveXObject) {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
else {
xmlhttp = new XMLHttpRequest();
}
xmlhttp.open("GET", "Time.aspx", true);
xmlhttp.onreadystatechange = readyStateChangedHandler;
xmlhttp.send();
}
function readyStateChangedHandler() {
if(xmlhttp.readyState == 4) {
alert(xmlhttp.responseText);
}
}
</script>
</head>

<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server
ID="ScriptManager1">
</asp:ScriptManager>
</form>
</body>
</html>
(CallTime.aspx) shows basic usage of the XMLHttpRequest
object to call the time web page

ASP.NET
AJAX NetworkingData Communication
ASP.NET AJAX
Networking
Data Communications
An important part of any type of distributed application is how data is pushed
around between tiers or layers of the application
With AJAX, the following concepts are important
XMLXML is Extensible Markup Language. It is primarily used for data interchange.
XSLTXSLT is Extensible Stylesheet Language Transformations. XSLT is designed to
take XML data from one format and put it into another format.
JSONJSON is the JavaScript Object Notation. JSON is a lightweight data
interchange format.

When tied together with web services, XML and JSON allow for data interchange
between different operating systems and also across the Internet.

ASP.NET
AJAX NetworkingData Communication-JSON
ASP.NET AJAX
Networking
Data Communications
- JSON
JSON is the JavaScript Object Notation, and it is a lightweight data
interchange format.
JSON's chief advantage over XML is that the data may be parsed fairly easily
using JavaScript's built-in eval() method.
JSON is conceptually similar to arrays and collections in procedural
programming languages.

JSON is built on the following data structures:


Name/value pairsThis may be called an object, record, structure (struct),
HashTable, keyed list, or associated array.

List of valuesThis list of values is referred to an array in most


programming languages.

Web Services & JavaScript


Web Services and JavaScript
ASP.NET 2.0 AJAX Extensions enables the call to ASP.NET Web services from
the browser by using client script. The page can call server-based
methods without a postback and without refreshing the whole page,

because only data is transferred between the browser and the Web
server.
Calling a Web service method from script is asynchronous.

To get a return value or to determine when the request has returned,


provide a succeeded callback function.
The callback function is invoked when the request has finished successfully,

and it contains the return value (if any) from the Web method call.
Provide a failed callback function to handle errors.

Services-&Example
JavaScript-Example
Web Services andWeb
JavaScript
using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Xml;
using System.Web.Services.Protocols;
using System.Web.Script.Services;
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo =
WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class ServerTime :
System.Web.Services.WebService
{
[WebMethod]
public string GetServerTime()
{
return String.Format("The server time is {0}.",
DateTime.Now);
}
}

Services-&Example
JavaScript-Example
Web Services andWeb
JavaScript
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<style type="text/css">
body { font: 11pt Trebuchet MS;

<body>
<form id="Form1" runat="server">
<asp:ScriptManager runat="server" ID="scriptManager">
<Services>

font-color: #000000;

<asp:ServiceReference path="ServerTime.asmx" />

padding-top: 72px;

text-align: center }
.text { font: 8pt Trebuchet MS }

</Services>
</asp:ScriptManager>
<div>
<h2>Server Time</h2>

</style>
<title>Simple Web Service</title>

<p>Calling a service that returns the current server


time.</p>

<script type="text/javascript">
// This function calls the Web Service method.

<input id="EchoButton" type="button"

function GetServerTime()
{

value="GetTime" onclick="GetServerTime()" />


</div>

ServerTime.GetServerTime(OnSucceeded);

</form>

<hr/>

// This is the callback function that

<div>

// processes the Web Service return value.


function OnSucceeded(result)
{

<span id="Results"></span>
</div>
</body>

var RsltElem = document.getElementById("Results");


RsltElem.innerHTML = result;
}
</script>
</head>

</html>

Rich AJAX ToolKit Controls


Rich AJAX Toolkit Controls

The Toolkit is a shared source project with code contributions


from developers from Microsoft and elsewhere.

The Toolkit contains some new controls that have AJAX


functionality and a lot of control exten-ders. The control
extenders attach to another control to enhance or
extend the controls functionality .
An extender is basically a server control that emits proper

script codethe client behaviorto enhance how a given


ASP.NET control behaves on the client

You might also like