Posts Tagged ‘ajax’

php ajax/jquery countdown

// August 13th, 2011 // 2 Comments » // Code

I recently came across the need to have a countdown displayed in one of our applications. I was going to be releasing a new version of our app and wanted the users to have an idea of how long it was going to take until the application was up and running. After a few searches I found a plugin that does just what I needed, it is a jquery plugin, very simple to use and to add to any php application in just a matter of minutes.

(more…)

Change ExtJs EditorGridPanel row color after edit

// May 19th, 2011 // 2 Comments » // Code, Featured

By adding an afteredit listener to your editor grid you’ll be able to change the row color on the fly, right after
the cell has been changed so users will be able to tell which records have been changed. I’ve added this instead of the little red tickbox since it is easier for the user to see and it just looks better.
Just in case this would conflict with the little red icon, I also went ahead and removed it with my custom.css file (shown below).

(more…)

Extjs Cascading (Dependent) Combo Boxes

// April 11th, 2011 // 7 Comments » // Code, Featured

This tutorial was written after one of my readers requested help with creating a dependent dropdown menu for continents, countries and states. I hope this helps everyone out there, who like myself, have struggled with this in the past.

First you’ll need to create the connect.php file, explained here.

Next create the 3 mysql/php/json files used for:
1. gathering data from mysql,
2. storing the data into a json array for each of the combo boxes you’ll be using (Continent, Country and State).

(Please adjust the paths to connect.php (mentioned above) and all other files used in this example
accordingly and create the required tables in mysql as needed)

Start by creating the continentQ.php file, to gather the continent data:
(more…)

Create Extjs PDF Report

// February 12th, 2011 // 12 Comments » // Code, Featured

I have been looking for ways to export MySQL data to pdf using ExtJS, and up to this day I haven’t been able to
find a simple solution. I finally came across a project called “PHPJasperXML”, which allows me to access MySQL data, export it to pdf from my ExtJS application, using php and without having to use any javascript.
Albeit, the report isn’t necessarily created by ExtJS, it is extremely easy to create the report and implement this on your ExtJS application.

**** Update May 17th 2011 ****
This is an alternate solution to PHPJasperXML, it uses jasperserver to store the report which can be accessed via its url and you can also use subreports and multiple parameters.

*****************************

(more…)

Array as ExtJS baseParams

// August 21st, 2010 // 3 Comments » // Code, Featured

In this tutorial I’ll walk you through using the results of an array as an ExtJS baseParams, with the help of php implode and php explode. ExtJS baseParams are parameters that can be passed with all requests, parameters are encoded as standard HTTP parameter using Ext.urlEncode. A typical basepaParams usage may look like e.g. baseParams: {id: ‘123′, foo: ‘bar’}, however, we’ll be using the results of an array as our baseParams instead of a single value. (more…)

Submit ExtJS Incoming Put Data into MySQL With PHP

// July 29th, 2010 // 1 Comment » // Code, Featured

Recently I built another ExtJS form panel containing a few form fields and an editable datagrid, and I wanted to implement the search box I used on a previous application. In theory this would’ve been a pretty simple task, taking into account I’ve already built both a search capable grid and an editable grid (I’ll be posting a tutorial on this in the near future), however, it wasn’t so easy, but I got it done and I’ll show you how. (more…)

How to Apply Custom CSS to ExtJS Row Editor Grid

// July 22nd, 2010 // 15 Comments » // Code, Featured

In this tutorial I’ll show you how to apply a custom css to an individual cell grid on an extjs editor grid. I wanted to be able to apply a different background color to certain cells in the grid where the user was required to fill in the data, just like you see on a form, where the background color for required fields are different from the generic fields. (more…)

How to Populate ExtJs MySql Datastore

// April 25th, 2010 // 15 Comments » // Code

In this tutorial I’ll show you how to gather data obtained from a database (MySQL) and convert to JSON and storing it in your datasore for later use by your datagrid. There aren’t many steps involved, first you just need to connect to your mysql database as in this tutorial. Once you have created the connection and gathered the data you wish to display, you just need to add this to your grid.js (or whatever you wish to call the file). (more…)

ExtJs GroupingView groupTextTpl Parameters

// April 19th, 2010 // 7 Comments » // Code

I have an Ext.grid.GroupingView in one of my ExtJs datagrids, and I’ve been wanting to change the way it displays some of the MySQL data. To be more specific, I’d like it to display other fields, besides the one being grouped by. The groupTextTpl option handles this, however, as most of the documentation on ExtJs, which is non-existent, it can be sometimes dauting to figure out how toget this accomplished.

(more…)

ExtJS Grid Search

// April 16th, 2010 // 12 Comments » // Code

ExtJS as stated on their site is a cross-browser JavaScript library for building internet applications. Most of the examples on their site deals with static data, and if you ask their experts on how to accomplish the same with mysql or any other database, they’ll probably tell you it is the same and just look it up in their api and figure it out.
Well, that’s just not good enough, so after countless hours of google searches trying to find the solution (which most of the time only involves a few lines of code), I’ve come of up with some simple steps that might help get your extjs grid search going so and I’ll share these with you.
(more…)