Showing posts with label ajax. Show all posts
Showing posts with label ajax. Show all posts

What is ASP.NET AJAX?  

ASP.NET AJAX refers to new components in ASP.NET that allow for building rich AJAX styled web applications using the design patterns familiar to ASP.NET developers. ASP.NET AJAX 1.0 was available as a separate add-on for ASP.NET 2.0. With the release of ASP.NET 3.5, the AJAX components have been integrated into ASP.NET (no separate download required).

AJAX components in ASP.NET integrate cross-browser script libraries with the ASP.NET server side Web application framework. This integrated architecture empowers developers to rapidly create pages with sophisticated, responsive user interfaces and more efficient client-server communication by simply adding a few server controls to their pages.

ASP.NET AJAX allows developers to choose their preferred method of AJAX development, whether it is server-side programming, client-side programming, or a combination of both.

Server-side AJAX Programming

Developers familiar with ASP.NET's server-side programming model can add AJAX functionality using the familiar server controls, and the convenient drag and drop gestures. For example, partial update functionality can be added to ASP.NET applications by wrapping sections of their websites in the AJAX server control 'UpdatePanel', which enables the server controls to update without a post back. This is as simple as AJAX programming gets. Developers don't have to learn about the underlying scripting or browser technologies. Based on the ASP.NET server side design patterns, developers continue to get key advantages such as a clean declarative model of specifying web page UI, an event-driven programming model, and a rich set of APIs from the .NET Framework.

Client-side AJAX Programming

Developers with a basic understanding of JavaScript can leverage client-side AJAX framework, that allows building client centric AJAX applications. For example, the client AJAX Framework allows developers to build rich client side components and controls and make calls to remote servers, including web services and then updating the Web page with the response. The response can be an HTML snippet or an XML document, allowing for simple or extensive updates to the Web page.

The Client side AJAX Framework works well with ASP.NET. The ASP.NET team also ships this framework independently as Microsoft AJAX Library. Since this framework is not tightly coupled with ASP.NET, it can be used with other server side technologies as well such as PHP and Cold Fusion.

ASP.NET AJAX Programming

ASP.NET AJAX shines in its ability to combine the best of server-side and client-side AJAX programming, providing Web applications with a user experience similar to the richness of traditional desktop applications. Watch some of the following videos to learn how simple it is to get started with ASP.NET AJAX programming.

Read More...

Different Types of FORM Submission using JavaScript, CURL, FSOCKOPEN , AJAX  

Here i want to discuss about the different way to submit a form.

Traditional Form Submit:
This is the most common form uses everywhere.

< action="targetpage.php" name="myForm">
[form elements]
< type="submit" value="send" name="send">
< /form >

JavaScript Form Submit:

You can call a javascript function at any event for example onClick at button or OnChange at combo box and so on. And inside your javascript just write the line above.

document.myForm.submit();

CURL Form Submit:
This technique is rarely used in our application but we can submit any form using CURL just like normal form. Here is an example :

$ch = curl_init();
curl_setopt ($ch, CURLOPT_URL, $url); // set the post-to url
curl_setopt ($ch, CURLOPT_HEADER, 1); // Header control
curl_setopt ($ch, CURLOPT_POST, 1); // tell it to make a POST, not a GET
curl_setopt ($ch, CURLOPT_POSTFIELDS, urlencode($queryString));
curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 0);
$response = curl_exec($ch);
curl_close ($ch);

FSOCKOPEN Form Submit:

This is also rarely used in our general application. For the Internet domain, it will open a TCP socket connection to hostname on port port. hostname may in this case be either a fully qualified domain name or an IP address. Here is a sample code:

$method =”GET” ; // POST or GET define here
$fp = fsockopen($host,80);
if ($method == ‘GET’)
$path .= ‘?’ . $data;
fputs($fp, “$method $path HTTP/1.1\n”);
fputs($fp, “Host: $host\n”);
fputs($fp, “Content-type: application/x-www-form-urlencoded\n”);
fputs($fp, “Content-length: ” . strlen($data) . “\n”);
fputs($fp, “User-Agent: MSIE\n”);
fputs($fp, “Connection: close\n\n”);
if ($method == ‘POST’)
fputs($fp, $data);

while (!feof($fp))
$buf .= fgets($fp,128);
fclose($fp);
return $buf;

AJAX Form Submit:

At any AJAX application we frequently use such code.

var http_request = false;
url ="myformactionpage.php";
parameters ="field1=val1&field2=val2";
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
` http_request.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}

http_request.onreadystatechange = alertContents;
http_request.open('POST', url, true);
http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("Content-length", parameters.length);
http_request.setRequestHeader("Connection", "close");
http_request.send(parameters);

Share your thought if you find any others way to submit a html form.

Read More...

Asynchronous JavaScript Technology and XML (Ajax)  

Using JavaScript technology, an HTML page can asynchronously make calls to the server from which it was loaded and fetch content that may be formatted as XML documents, HTML content, plain text, or JavaScript Object Notation (JSON). The JavaScript technology may then use the content to update or modify the Document Object Model (DOM) of the HTML page. The term Asynchronous JavaScript Technology and XML (Ajax) has emerged recently to describe this interaction model.

Ajax is not new. These techniques have been available to developers targeting Internet Explorer on the Windows platform for many years. Until recently, the technology was known as web remoting or remote scripting. Web developers have also used a combination of plug-ins, Java applets, and hidden frames to emulate this interaction model for some time. What has changed recently is the inclusion of support for the XMLHttpRequest object in the JavaScript runtimes of the mainstream browsers. The real magic is the result of the JavaScript technology's XMLHttpRequest object. Although this object is not specified in the formal JavaScript technology specification, all of today's mainstream browsers support it. The subtle differences with the JavaScript technology and CSS support among current generation browsers such as Mozilla Firefox, Internet Explorer, and Safari are manageable. JavaScript libraries such as Dojo, Prototype, and the Yahoo User Interface Library have emerged to fill in where the browsers are not as manageable and to provide a standardized programming model. Dojo, for example, is addressing accessibility, internationalization, and advanced graphics across browsers -- all of which had been thorns in the side of earlier adopters of Ajax. More updates are sure to occur as the need arises.

What makes Ajax-based clients unique is that the client contains page-specific control logic embedded as JavaScript technology. The page interacts with the JavaScript technology based on events such as the loading of a document, a mouse click, focus changes, or even a timer. Ajax interactions allow for a clear separation of presentation logic from the data. An HTML page can pull in bite-size pieces to be displayed. Ajax will require a different server-side architecture to support this interaction model. Traditionally, server-side web applications have focused on generating HTML documents for every client event resulting in a call to the server. The clients would then refresh and re-render the complete HTML page for each response. Rich web applications focus on a client fetching an HTML document that acts as a template or container into which to inject content, based on client events using XML data retrieved from a server-side component.

Some uses for Ajax interactions are the following:

  • Real-time form data validation: Form data such as user IDs, serial numbers, postal codes, or even special coupon codes that require server-side validation can be validated in a form before the user submits a form. See Realtime Form Validation for details.

  • Autocompletion: A specific portion of form data such as an email address, name, or city name may be autocompleted as the user types.

  • Load on demand: Based on a client event, an HTML page can fetch more data in the background, allowing the browser to load pages more quickly.

  • Sophisticated user interface controls and effects: Controls such as trees, menus, data tables, rich text editors, calendars, and progress bars allow for better user interaction and interaction with HTML pages, generally without requiring the user to reload the page.

  • Refreshing data and server push: HTML pages may poll data from a server for up-to-date data such as scores, stock quotes, weather, or application-specific data. A client may use Ajax techniques to get a set of current data without reloading a full page. Polling is not the most effecient means of ensuring that data on a page is the most current. Emerging techniques such as Comet are being developed to provide true server-side push over HTTP by keeping a persistent connection between the client and server. See this blog entry on Comet using Grizzly for more on the development of server push with Java technology.

  • Partial submit: An HTML page can submit form data as needed without requiring a full page refresh.

  • Mashups: An HTML page can obtain data using a server-side proxy or by including an external script to mix external data with your application's or your service's data. For example, you can mix content or data from a third-party application such as Google Maps with your own application.

  • Page as an application: Ajax techniques can be made to create single-page applications that look and feel much like a desktop application. See the article on the use of Ajax and portlets for more on how you can use portlet applications today.

Though not all-inclusive, this list shows that Ajax interactions allow web applications to do much more than they have done in the past.

Read More...