AJAX Web Form for Adding Multiple Records to MVC Database

Saturday, April 30th, 2011|Beginner tips, Version 4|by Romans|2 Comments

Some time ago a PHP developer asked me – “How to add 50 employees though a single page”. Building a fluid data-entry web form which would allow adding unlimited records to the database without making user wait is not an easy task and normally require knowledge of JavaScript, AJAX, jQuery, PHP, HTML and CSS.

This blog post describes a simpler way to implement this complex task. I will be taking advantage of a Simple PHP UI Framework — Agile Toolkit. This will help me focus on the UI logic of the form instead of technical implementation and get job done within a very short time and little effort.

I set a number of goals in front of me, which are impossible to achieve with plain PHP or even with others, more complex frameworks. This example also helps to illustrate approach of Agile Toolkit in building Web UI, creating re-usable code and using AJAX. My goals are:

  • Code must be no longer than 50 lines of code, no custom HTML or JavaScript;
  • Must look very simple to read and understand;
  • User can continue entering data without stopping using Tab key and keyboard only;
  • Data must be submitted and saved automatically;
  • Must work with any Model therefore can be used for purpose of adding any type of record;
  • Must never reload page or make user wait. Should work even on slow internet connection;
  • Resulting code must be re-usable and customizable.

Agile Toolkit was a great help. I successfully completed all the requirements and produced a clean data entry screen. In fact, the solution works so great that I turned it into official add-on. Any user of Agile Toolkit can take advantage of this add-on by writing:

[php]
$this->add(‘InfiniteAddForm’)->setModel(‘Employee’);
[/php]

To find out more and download Agile Toolkit for free, open-source version, visit http://agiletoolkit.org. If you are curious about how I solved this task, continue to read this article.

Read more

Comparison of Propel, Doctrine and Agile Toolkit ORM

Sunday, April 24th, 2011|Brainstorming, Version 4|by Romans|4 Comments

In this article I am comparing many different aspects of the 3 different ORM systems. ORM means Object Relational Mapping and it is a way to present database data in object-oriented way. Agile Toolkit is a full PHP UI Framework but it comes with a built-in ORM (Object Relational Mapping). Propel and Doctrine are the two most popular ORM engines for PHP today. In this article I am comparing many different aspects of the 3 different ORM systems.

Read more

What needs to be done for 4.0.4 version

Friday, April 22nd, 2011|Brainstorming, Version 4|by Romans|

We are looking forward to releasing 4.0.4 version and are thinking what kind of features people need in a stable branch. Currently we would like to add:

  • Question feed from StackOverflow embedded into example app
  • Issue feed from github.com
  • Back-port support for setModel() from 4.1 branch

Are there anything else what you are willing to see in next STABLE release. Our priority is stability of the code and compatibility for existing 4.0 software, but please comment and suggest.

Adding Twitter button to AJAX page

Monday, April 18th, 2011|Beginner tips, Version 4|by Romans|1 Comment

Twitter button is simple to add if you follow official guide. The code produced by the guide would contain a regular link and a JavaScript include. Executing the code would make the button look cool. Here is a sample code:

<a href="http://twitter.com/share" data-count="vertical" data-via="atk4">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Unfortunately this code wouldn’t work if you will try to put it on the AJAX page. AJAX will not allow you to include script from a different domain name for security reasons.

A common way to get around this restriction is to place file locally. However, twitter may decide to change the file, and we will end up with outdated copy. We need to build a proxy instead.

In terms of Agile Toolkit, the proxy would be implemented as a class, which you add to the page. The syntax of such a class would be as straightforward as this:

[php]

$this->add(‘Controller_JSProxy’)
->proxy(‘http://platform.twitter.com/widgets.js’);

[/php]

This adds include to the current page from the specified URL. Below is the implementation of the proxy controller.

[php]

class Controller_JSProxy extends AbstractController {
function proxy($url){
$this->owner->js(true,’$.atk4.includeJS("’.
$this->api->getDestinationURL(
null,array($this->name=>1)).’");’);
if(isset($_GET[$this->name])){
readfile($url);
exit;
}
}
}
[/php]

Stigasoft announces support for Agile Toolkit

Friday, April 15th, 2011|Version 4|by Romans|

Since we started promoting Agile Toolkit over a month ago, the feedback have been incredible. We heard from individuals who are learning Agile Toolkit for their own projects as well as companies. We are happy to hear a first announcement from Stigasoft. Great job on learning Agile Toolkit! How many week it took? Three?

Maintenance release 4.0.3

Wednesday, April 6th, 2011|Version 4|by Romans|

Agile toolkit 4.0.3 fixed bug https://github.com/atk4/atk4/issues/9 which was showing on new installation mechanism (without .htaccess) if you use sub-pages

Tags:

Agile Toolkit version 4.0.2 Released

Tuesday, April 5th, 2011|Version 4|by Romans|

I am pleased to announce that next stable release of Agile Toolkit is ready to be downloaded. If you already have a project using Agile Toolkit, then you will need to replace “atk4″ folder with the new one. You can download atk4 / atk4-addons separately from Agile Toolkit Download Page.

To see list of changes in this version, see: http://agiletoolkit.org/whatsnew.

For new users, I recommend watching our latest screencast.

Tags:

PHP5 Forms with AJAX submit – best practices

Tuesday, April 5th, 2011|Beginner tips, Brainstorming, Version 3, Version 4|by Romans|

Forms are the foundation of interactive web and what we call Web 2.0. In this article I will walk through the possible problems web developers encounter when creating web forms and solutions to those problems.

This article will be useful to people who are starting web development or who are experienced at it.

This article refers to Form implementation in Agile Toolkit. For documentation and demonstrations of forms in Agile Toolkit see http://agiletoolkit.org/doc/form

Read more

Tags: , , , , ,