Tutorial : Overlay a AJAX Spinner in the center of Web Page using Prototype

This tutorial is specially for beginners who are wondering how to place an AJAX Spinner. Its very simple guys. Just read below to find out.

To those people who have wondered how to show the spinner image + loading message when any ajax request is made and to hide the spinner image + loading message when the request is successfully completed, this tutorial will help you out in achieving it and also teaches you how to show this loading box in the center of the browser screen and grey out the background contents with cool fade effects.

Index :

• Page 1 : Introduction
• Page 2 : Required HTML/Javascript Code/CSS
• Page 3 : Complete Code of Demo

Pre-Requisites :

A little bit of CSS,HTML knowledge and know-how of Prototype, Scriptaculous.

Tutorial : Auto Completer using Prototype, Script.aculo.us

How many of you have always dreamt of creating an Auto Suggest Box. I bet everyone must have seen one of these somewhere or the other. if you use Gmail to send mails, you might recall that while typing the To address, Gmail shows a probable list of users from your address book. Nowadays most of the modern browsers also have this Auto Suggest control built in them, i.e when the user begins to type in a text box, a menu appears below the text offering completion suggestions.

Today I am going to teach you how to create an Auto Suggest Box using Prototype, Script.aculo.us. The script.aculo.us auto suggest box (autocompleter) replicates this control, but gives the developer control of the probable suggestions.

Index

• Page 1 : Introduction and
• Page 2 : Auto Suggest Box (local)
• Page 3 : AJAX Auto Suggest Box (remote via PHP/MySQL)

Demo & Source Download

Type out the name of the states of U.S.A.
Local Auto Suggest Box Demo : Click Here
Remote Auto Suggest Box Demo : Click Here

Download Source Here

Tutorial : Introduction to AJAX in Ruby on Rails with Prototype, Script.aculo.us

Heya,
After a long time I had the time to update my blog. I have been working on my project presentation for the past 2 weeks. The entire presentation was developed in Flash CS3 coded in ActionScript 3. It was ages since I had used Flash and I was quite astonished how it had changed over the years. I`ll be soon posting some tutorials on Flash, so do keep an eye out

Anyways apart from being a bit off-topic, This tutorial deals with AJAX implementation in Ruby on Rails 2. While I was learning RoR, I had lot of issues of properly having AJAX implementation in my projects. This tuorial is for those people out there.

In this tutorial, I`ll just show some very simple Script.aculo.us Animation Implementations in RoR.
View Demo

Tutorial : AJAX interface/menu using jQuery/PHP

Hello Guys,

I have been busy with college lately, since this is my last year in college, I need to do a very cool project to get some good marks . Anyways that doesn`t mean I won`t be postin tutorials here . Want to present your data using AJAX/PHP/MySQL by just coding few lines ? Well here it is. This tutorial teaches you how to present data using AJAX (using jQuery) with some neat effects. We can use PHP/MySQL to store the data and call it. In this tutorial I`ll teach you how to do so with PHP. So lets begin !

You can check the demo HERE.
You can download these files HERE

Index

1. Create the HTML page – index.html
2. • The CSS
   • The HTML
   • The Javascript
   • Final interface.html page
3. Create the PHP File – boo.php

Exploring Javascript Frameworks : jQuery 1.2.6

Hey guys,

You might be wondering where the hell are the Rails Tuts ! But before that, some of you might have read the Tutorial : Introduction to AJAX with PHP, if you think coding AJAX is tough, think again ! Recently I have been doing a lot of research about different javascript frameworks which will help me ease AJAX and I came across JQuery and Prototype. It seems they were very commonly used by lot of people. Not only that, these frameworks, besides just providing AJAX they have a lot of cool features. So I decided to explore them.

This post explores some neat tricks I could do using jQuery ! So read on guys if you wanna learn

Index

• Introduction
• What is jQuery ?
• Download jQuery ?!
• Playing with jQuery ?!
• jQuery Effects ! ?

Tutorial : Intoduction to AJAX with PHP

Hey Everyone,

I have been busy lately, but that ain`t gonna stop me from writing tutorials ! Anyways I had promised a Ruby on Rails tutorial, I am working on that, I am trying to make it as descriptive as possible, but before I post that, a lot of people asked me what is AJAX, how to integrate it with PHP/MySQL etc ? Well guys, This tutorial is dedicated to you all !

Along with answering all your queries, I will be teaching you how to make a simple application in PHP/MySQL using AJAX.

Index

• Page 1 : Introduction
• Page 2 : Introduction to ‘AJAX’
• Page 3 : General AJAX code
• Page 4 : Ajax Application using PHP (Username validator)
• Click here to see demo

Required : Some basic knowledge in Javascript, HTML.