Upload progress bar in CodeIgniter without Flash

Today we will see how we can create a progress bar file upload in CodeIgniter without the need for libraries or plug-ins made with Flash (like SWFUpload) that are beyond our control, because usually these libraries offer us already compiled .swf files, so we can not change anything in them, just in case we have knowledge of programming in ActionScript 2 or 3.

First of all, we have to say that creating a progress bar file upload in PHP is not as easy as it seems. The first problem is that PHP versions prior to 5.2 do not provide the necessary tools to provide information about the file upload at every moment. The second problem is that AJAX, by itself, does not allow us to check the status of the file upload process, since, for obvious security reasons, JavaScript does not have access to files on the client operating system, so you need a “trick” using an iframe.

scrollTo: The jQuery plug-in and our CSS

The jQuery plug-in scrollTo (developed by Ariel Flesler) enables us to make our website to scroll (scrolling the vertical bar) to any item on our document we need, this way we can focus the user’s attention in that element each time the page is reloaded (for example, an entry in the left menu on our website), sparing the user from having to do it manually. On the website of the plug-in project you can find all (or almost all) the documentation that is needed to integrate it into your own project.

Sending forms with AJAX in CodeIgniter

Today we are going to explain how we can send a form via AJAX using jQuery in CodeIgniter, so we avoid to reload the whole page, giving the appearance of “desktop application” to our web application, being able to perform certain actions without reloading the entire page view.

Creating the form

First, we need to create our form. In this case we will create a generic form, where we will add different types of fields to make the example as complete as possible, but functionally not very helpful, mainly for teaching purposes… So in our view file in CodeIgniter we add the following code:

CodeIgniter and JSON with jQuery

In this post, we are going to talk about how to receive data in CodeIgniter via JSON, using for that the JavaScript framework jQuery. But before that, we need to clarify a bit what is JSON and what is it used for.

What is JSON? What is it used for?

JSON stands for JavaScript Object Notation. So, it is a way of writing the properties of objects in JavaScript so that they can be sent between client and server and vice versa. This format is very light due to its internal structure, which is quite human readable, and it is very easy to process by machines. While there is a debate about which format is better, if XML or JSON, for sending and receiving data via AJAX, there is a large community of developers who bet on JSON as the AJAX communication technology that will prevail in the future, alleging among other things that being lighter than XML the communication between client and server is faster. […]

Adding AJAX to Codeigniter with jQuery

Today we will talk about adding AJAX to the PHP development framework called CodeIgniter. When I started to work with this framework I found rather strange that there was not too much information about how to integrate AJAX into it, since it is a relatively known framework and AJAX methodology is very common in web development. When I had the need to integrate AJAX using the JavaScript framework jQuery into my application made with CodeIgniter, I have been looking for information about this subject on the Internet and the truth is that, besides being very scattered, it is not very abundant and not very clear, so here it is my contribution from what I have learned, hopefully useful. […]