Send and Retrieve Data Using JSON & AJAX (Via Netbeans 7.0)

Download Link : Click here to download

In this example I would like to share you a simple project I’ve created to Send and Retrieve Data Using JSON & AJAX, Specially if you are a beginner for JSON & AJAX.

“We use JSON to store and transport data as we do in XML, But in a more smaller, faster and easier way than XML. AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.”
 

The Example contains A Netbeans 7.0 Project file and MySQL Database Backup where the application transacts with a MySQL database to retrieve data using JSON & AJAX.

ex1ajaxjson

The application searches for user details by UserID and displays in Name & Address fields without refreshing the page.

Javascript Basics Exercise 04 – How to change background color of the page on click

Source File : Click here to download

In this example, I’m gonna show you simply, on how to change background color of the page using javasript when a button was clicked. So let’s add our <script> between <body> tags as follows,

<script language="javascript">
function changeColor(){
document.bgColor = "Red";
}
</script>

Here what we did was, we defined a new function called “changeColor()” where it instruct to turn the color of the document to RED. So, now we shall add a button in the body to call that function when it was clicked.

<input type=”button” onClick=”changeColor()” value=”Change”/> 

Save and Open the File, Click on the button.

Simple TIC TAC TOE Game Development Using Javascript

Source File : Click Here to Download

In this post I’m gonna share a simple development of  Tic Tac Toe game which can be played by two players. ( No Artificial Intelligent techniques used, Just Simple Javascript).

From this sample application what you can learn;

  • Basic use of javascript functions
  • Handling HTML and CSS layouts
  • Working with two dimensional arrays in javascript
  • Change background image of a div using java script
  • Create roll over images in HTML with CSS
  • How to refresh a page using javascript
  • Use of IF, ELSE IF statements in javascript
  • Change innerHTML value using javascript (Ex: value inside a pair of anchor tags)

GUI-TicTacToe

Note : Just download the RAR file, extract, run tictactoe.html, don’t change the “img” folder.