Ajax with CodeIgniter

What is Ajax ?

Ajax is a group of technologies which allows to send and retrieve data from the server without interfering with the display or behaviour of the existing page.Ajax(Asynchronus java-script +XML) uses HTML and CSS to combine and style the information.The DOM is accessed by JavaScript to dynamically display and allow the user to interact with the information presented.JavaScript and theXMLHttpRequest object provide a method of exchanging data between browser and server without full page reloads.

How to use ?

First you have to implement a JavaScript function as shown below 

url : have to specify the controller and the specific function
Type: Type of passing the data can be GET or POST
data: in this section you have to specify the the data which you want to pass to the back end.

Controller

 

Using $_GET[] method you can get the value which is passed from the JavaScript and use it in the back end.

Here what i have done is  i aqured the post id and passed it to the model post.

Drawbacks

• In pre-HTML5 browsers, dynamically created pages using successive Ajax requests does not register im the   browser's history, so clicking the browser's "back" button may not have returned the previous  Ajax-enabled page,It will return to the last static page insted.

• Cannot be Bookmarked.

• Any  browser which  does not support JavaScript or XMLHttpRequest,  will not be able to properly use pages which depends on Ajax.

• This kind of programming can lead to complex code that is hard to maintain,  debug or to test.

Downloading and Setting up CodeIgniter Framework with Dreamweaver

CodeIgniter...

CodeIgniter is an Open source  powerful lightweight framework for PHP developers who wants a simple and elegant toolkit to create dynamic web applications. It has a light footprint,exceptional performance,broad capability with standard hosting and many more.CodeIgniter is a loosely based on Model-View-Controller*(MVC) development pattern.

To create a PHP web site there are some prerequisites, 

1. First you have to Download the Dreamweaver IDE and install it on your computer.
2. Use the following link to download WAMP server and install it. 
3. Run WAMP server.

 http://www.wampserver.com/en/

Now lets Set up CodeIgniter

1. Create a folder called ci2, inside www folder (C:\wamp\www)
2. Use the follwing link to download the latest version of CodeIgniter
https://ellislab.com/codeigniter  
3. Unzip the package.
4. Put All the files in to ci folder (C:\wamp\www\ci2)

Now lets set up Dreamweaver

  1. Launch Dreamweaver and go to Site->New Site

2. Name the site as ci2 and give local site folder path as C:\wamp\www\ci2\

 
3. Go to servers and add a new server by clicking the [+] button

4. Fill the Fields according to the image given below

 

5.Finally untick the remote server and tick testing and hit save

   

6. Once you have successfully created the site all the files will be displayed on the Files panel on the bottom right hand side.

7. Now navigate to application->config->database.php using the files panel 

 

8. Fill the details according to the image below and save the file

9. Now Click on the wamp icon on the menu bar and select phpmyadmin

10.Create a database called ci.

11.Now go back to Dreamweaver and double click on index.php file

  12. Now click on the preview button.

  13. If you get this Screen you have successfully configured CodeIgniter

MVC Devolopment Pattern

What is MVC?

MVC was one of the seminal insights in the early development of GUI s.Is is one of the first approaches to describe and implement software constructs in terms of their responsibilities.MVC stands for Model-View-Controller is a Software design pattern for implementing user interfaces. It separates the representation of information from user interactions.This separation of components allows great code re-usability and logical separation of program responsibilities which means code is more organized.This software pattern has three components.

MVC Components

• Model

 Model is a representation of data, Business rules and functions.All the CRUD (Create,Read,Update,Destroy) functions are defined here. model notifies its associated views and controllers when there has been a change in its state. This notification allows the views to produce updated output, and the controllers to change the available set of commands. In some cases an MVC implementation might instead be "passive," so that other components must poll the model for updates rather than being notified.

• View

View is the representation of information that presented to the user. All the HTML rendering takes place in the view.

• Controller

Controller is the intermediary between Model and view. It decides what to do according to the users input.It sends messages for both View and Model to do specific tasks according to the users input.

Interactions