Aug 07 2008

A magical AJAX-enabled JQuery grid worth looking into

Published by admin under Software Development

In streamlining the user experience of my ATK modules, I have been considering the integration of external sources. Two of these external sources have been the JQuery plugins: Flexigrid and jqGrid.

Both plugins are great. They both provide AJAX paging and record searching among other things. I went to the extent of integrating Flexigrid into the dashboard of my ATK ERP/CRM module and it brought a completely new experience to the mix.

Recently I have come to find another JQuery grid plugin, which probably offers more than Flexigrid. Its name is jqGrid.

In my view, these are the items that sets jqGrid apart:

- Great documentation

- Over 45 practical demos with source code

- Well rounded feature-set and active development

The following are 3 features that jqGrid offers out of the box, which I would love to see in the ATK grid:

Inline editing:

Inline editing may be be triggered in different ways. In the screenshot below, inline editing is triggered by clicking on the “E” button located on the left Actions column.

See it in action:

To see inline editing in action follow these steps:

1. Visit: http://trirand.com/jqgrid/jqgrid.html

2. Click on “Row Editing” from the left menu

3. Click on “Custom Edit” and then on the “E” button of any row

AJAX-driven Master-Detail directly in list mode:

Clicking on one of the records in the master grid, automatically makes an AJAX call to acquire data for the detail, which gets displayed on the detail grid, within the same page.

See it in action:

To see the master-detail in action follow these steps:

1. Visit: http://trirand.com/jqgrid/jqgrid.html

2. Click on “Advanced” from the left menu

3. Click on “Master Detail” and then on any row from the “Invoice Header” grid

Subgrids or grouping:

Grouping data on the main grid comes in two flavors: Subgrid and Grid as Subgrid. Both of these are triggered in the same way. Mainly be clicking on the plus(+) sign that is located on the left column of the main row. The difference between the two is that Grid as Subgrid is a Grid with complete features including searhing and paging.

See it in action:

To see the Subgrids in action follow these steps:

1. Visit: http://trirand.com/jqgrid/jqgrid.html

2. Click on “Advanced” from the left menu

3. Click on “Subgrid” or “Grid as Subgrid” and then on the plus(+) sign of the left column on the grid to view the subgrid of any row

Screenshot of Subgrid:

Screenshot of Grid as Subgrid:

Other nice feature - Toolbars and search:

Toolbars:

Toolbars are already part of ATK, and is also great that jqGrid supports it.

See it in action:

To see the Toolbar in action follow these steps:

1. Visit: http://trirand.com/jqgrid/jqgrid.html

2. Click on “New in version 3.1″ from the left menu

3. Click on “Toolbars and userdata” and then notice the “Click Me” button on the top grid and the “Total Amount” label at the bottom of the lower grid.

Search:

Search is triggered by clicking on the icon located on the lower left corner of the grid. Although jqGrid allows the user to search several fields, only one field can be searched at the time. I prefer ATK’s search feature, which allows the user to filter multiple fields at the time.

See it in action:

To see the Toolbar in action follow these steps:

1. Visit: http://trirand.com/jqgrid/jqgrid.html

2. Click on “Manipulation” from the left menu

3. Click on “Grid Data” and then on the icon located on the lower left section of the grid.

References:

- jqGrid Download page

- jqGrid Demos page

- jqGrid Documentation page

- ATK is a special purpose PHP framework, targeted at business applications. It allows you to build an application with very small amounts of code.

Hopefully we’ll get to see some of these features make it to ATK in the near future.
_________________
Jorge Garifuna
Professional Web Developer
Garinet Global Inc.
http://www.GariDigital.com

Share This Post

4 responses so far

Jun 18 2008

PHP ATK Framework gets a brand new website

Published by admin under Software Development

After using the PHP ATK Framework for a few years, I am extremely happy to see a brand new website that showcases the magical framework. ATK is one of the few respectable PHP frameworks that allows developers to write a PHP application in 10 lines of code.

Although the framework offers nearly complete solutions for Web Applications, some developers have been put off by the existing ATK license.

The license issue will soon become a thing of the passed. According to their new website, “As of version 6.2, the license of ATK is the LGPL license. This means you can use it at will in open source or closed source products.”

I’ve put ATK to the test in the following projects and it has delivered every time:

  • Cross-functional Enterprise Resource Planning (ERP) system
  • Automated Bilingual eCommerce Webstore System
  • Content Management System
  • Multilingual Project Management System
  • Document Management System
  • Complete Personal Finance System with national data expense comparison
  • Financial Tools, including product profitability analysis and amortized loan payments
  • Credit Report Management System
  • Personal List Shopping Tracking System
  • Salary Hourly, Weekly, Bi-Weekly, Semi-Monthly, Monthly and Yearly Breakdown System
  • Business Card Management System
  • Websites Management System
  • Activity Management System with Calendars and Email notifications
  • Automobile Management System with depreciation, equity and annual gas expense
  • Marketing Management System
  • College Savings Plan Application accounting for inflation
  • Valuables Equity Sheet Application
  • Book Collection System
  • DVD Collection System
  • Bookmark Management
  • Events module
  • Photo gallery module
  • Testimonials module
  • Sound bytes module
  • Video management module
  • Feedback form module
  • Banner Management module
  • Search module
  • Front image/ads rotator module
  • Tell a friend module
  • Random product display module
  • Sponsors Module
  • Links module

Some of these modules are implemented on the following sites, which are powered by ATK:

http://www.garitv.com/

http://www.garinet.com/

http://www.garinetmedianetwork.com

Visit ATK’s brand new website at:

http://www.atk-framework.com

If you are new to ATK, feel free to read about my experience on how I learned ATK.

Share This Post

4 responses so far

Jul 29 2005

How Jorge Garifuna Learned to Use ATK to Create PHP Applications Super Fast

Published by admin under Software Development

If the sound of ATK sounds unfamiliar, then consider the following question: Is developing web applications super fast an important factor to your software development career? If the answer to this follow up question is yes, then ATK might be the PHP framework to give a very high consideration to.

First and most importantly, the author would like to commend the creator of ATK, Ivo, and his team for creating a fantastic framework for PHP development.

If the sound of ATK sounds unfamiliar, then consider the following question: Is developing web applications super fast an important factor to your software development career? If the answer to this follow up question is yes, then ATK might be the PHP framework to give a very high consideration to.

When the author first made the decision to port all his applications from PERL to PHP, he started looking for solutions that would allow him to work the way he was accustomed to working in PERL, so he could get his job done faster.

To accelerate the application development process in PERL, he wrote a mini-engine that would generate the entire code-set of a database driven application. After he started hitting walls in PERL, he realized that PHP had a lot to offer for web applications and his hunt began for the appropriate solution.

He tried several PHP packages but nothing seemed to satisfy his needs to create applications that he could use in a production environment. He first learned about ATK in May 2005 from a post at Slashdot.org. He visited the ATK page, tried the demos and bookmarked the page on May 19, 2005.

At first he was not very impressed with what he had seen in the demos. It wasn’t until later that he realized that the demos, do not do justice to the power of ATK. At first hand, the demos look and navigate like anything anyone would expect on an application, but when taken a closer look at the source code and look back at the interface, it is easy to see the minimal code needed to create such smooth functionality.

For what ATK could do, the author thought that the learning curve was too much and at the time he just wanted something that would get the job done. In either case, he put ATK in the back burner and continued his search for the next best thing. He looked just about everywhere that he could have access to. Tried customizing a few solutions here and there, but it would take him a very long time to implement the goodies that he wanted to be productive in a short amount of time.

After exhausting all his options, he decided to go into the pages that he had bookmarked in the past few months and give ATK a second look. By then it was, October 2005, and he was convinced that there was nothing else out there better than ATK to develop web-applications relatively fast. Although not required, he gave his donation for the first time ever to an open source project.

To lessen his fear of what he thought was going to have a huge learning curve, He resisted coding right away and instead, decided to read guides provided on the documentation section of the site located at:

http://www.achievo.org/wiki/ATK

Then downloaded ATK from:

http://www.achievo.org/atk/download

After reading and practicing the examples on the guides the author started creating his own application. He started by creating a basic proposal application, which was composed of four parts:
- The company information of the user
- The customer information
- The job location information (a customer could have multiple job locations)
- The proposal information

He had the application up and running within a day(about 4 hours). On the second day he enhanced the application and presented it to the potential user. During the presentation the user wanted a small addition to the interface, which the author was able to add in 30 seconds.

From creating his first application the author learned a great deal about ATK. He managed to squeeze the following features into his proposal application:
- Help content specific to each section
- PDF creation of the proposals for printing using FPDF (not part of ATK but easy to integrate)
- Upload files
- Create attractive content
- Associate proposals to customers and job locations through relationships
- Duplicate(copy) records with the click of one button
- Make mandatory fields through a simple flag and have them validated automatically by ATK
- Make searchable fields through a simple flag
- Ability to select/deselect multiple records with a simple flag
- Organize fields within tabs

Best of all, ATK, allows the author to quickly create an application based on a given database table information, just like he was accustomed to in PERL. By using the ATK component called, atkMetaNode, the developer can have ATK create the entire code and navigation for a specific table. This was the secret to the author adding an additional field to the proposal application and have it displayed on the interface within 30 seconds.

It is the author’s best intentions to have given developers of PHP an overview of what ATK can do for them to improve the development process of web applications in PHP.

Jorge Garifuna
Professional Web Developer
Garinet Global Inc.
http://www.GariDigital.com

Share This Post

One response so far