Skip to main content

Related Articles

AJAX Extensions on Microsoft Visual Studio 2008

AJAX is a new trend in web development where it gives very smooth functionality for your website. In simple term we can use AJAX technology to refresh individual parts of the web page without refreshing whole page. This feature will increase the efficiency of your web page, smooth operation and enable more description web page design.

What is AJAX?
AJAX = Asynchronous JavaScript and XML.
AJAX is not a new programming language, but a new way to use existing standards.
AJAX is the art of exchanging data with a server, and update parts of a web page - without reloading the whole page.
Microsoft Visual Studio 2008 is coming with rich collection of AJAX controllers built in. AJAX is based on Java and JavaScript so it is nothing to do with .NET or Visual Studio. But most importantly we can easily use AJAX with most of the web development project. With AJAX Extensions of Visual Studio 2008 we can use AJAX with the visual studio development environment. This is really easy and fun. Let do it with a small project, so that you can easily understand the concept.

In this project I will show you how to develop a web page that will display current server time stamp without refreshing web page again and again. To get server time web page should send request, get response and display it. In this basic example I am using ScriptManager and UpdatePanel controllers. ScriptManager is a highlevel controller define with respect to the web page. But you can have one or more UpdatePanel for a given web page. Those UpdatePanel s can be individually update based on deferent events. So you should understand that we can perform several functions on the web page at a given time synchronously using multiple UpdatePanel s.

Fig 1: AJAX Extensions Toolbox

AJAX toolbox contains ScriptManager, ScriptManagerProxy, Timer, UpdatePanel and UpdateProgress controllers. More frequently we use ScriptManger and UpdatePanel. Update panel we use to place controllers that need to get update with the page events, but without page refresh. In this example you can see I have add ScriptManger and UpdatePanel. Within UpdatePanel there is ContentTemplete, inside that you can I have placed two buttons and one label. Once you click on one button it will display the current server time on the label and click on other button will execute javascript method "test".

Fig 2: How to use AJAX ScriptManger





Fig 3: How to use AJAX UpdatePanel





The final step is to write code for server side operations. Write respective server side code inside the particular controllers' (Eg: button, menu...) event handling methods same as you do in normally applications. But here different is this server side code will execute on server and send results to corresponding controller but no page refresh.

Fig 4: How to write server side coding in AJAX

Comments

Popular posts from this blog

Angular PrimeNG checkboxes styling and events handling

  Getting Started With PrimeNG Styling in Angular App This chapter I am planning to show how you can handle events of the checkboxes. For that I will use checkbox for every card to place the order.  To use PrimeNG checkboxes you have to import checkbox module in app.module.ts file. import {CheckboxModule} from 'primeng/checkbox'; import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { LandingComponent } from './modules/landing/landing.component'; import { HomeComponent } from './modules/home/home.component'; import { CardModule } from 'primeng/card'; import {CheckboxModule} from 'primeng/checkbox'; @NgModule({ declarations: [ AppComponent, LandingComponent, HomeComponent ], imports: [ BrowserModule, AppRoutingModule, CardModu

The Power of ChatGPT and Whisper Models

A Deep Dive into Natural Language Processing Natural Language Processing (NLP) has seen a significant boost in recent years due to advancements in artificial intelligence and machine learning. Two models that have shown remarkable success in NLP are ChatGPT and Whisper. In this article, we will delve into the power of these models and their applications in the field of NLP. ChatGPT is a transformer-based language model developed by OpenAI that uses unsupervised learning to predict the next word in a sentence based on the context of previous words. ChatGPT is a generative model that is trained on large datasets of text, such as books and articles, and can be fine-tuned for specific tasks, such as question-answering or dialogue generation. ChatGPT is known for its ability to produce human-like text, making it an ideal tool for applications such as chatbots, content creation, and language translation. Whisper, on the other hand, is a paraphrasing model developed by Google that is based on

Getting Started With PrimeNG Styling in Angular App

  This chapter I am going to explain how you can do the styling to our flower store app. There are different kind of CSS frameworks you can use to style you app. Such as: 1.        Angular Material 2.        ngx-bootstrap 3.        NG bootstrap 4.        Prime NG   I am planning to use PrimeNG styling framework to style our flower store app. PrimeNG has more than 80 UI component and it is a collection of rich UI components for Angular. All widgets are open source and free to use under MIT License.   How to Install Prime NG 1.     Run   npm install primeng –save  inside your root folder.                    2.        Run npm install primeicons –save to install prime icons. 3.        Run npm install font-awesome --save to Install Font Awesome 4.        Run npm install @angular/cdk –save to install angular  component dev kit. Now we are done with installing Prime NG to out flower store app. If you check your package json you will see below list of libraries.