Monthly Archives August 2014

Validating Your Online Form When User Clicks Submit with ZK Framework

Posted by admin on August 19, 2014  /   Posted in Business, Online Platform, Web Development, ZK

So you’re using ZK Framework to build your online forms, and your forms have fields which needs validations. You have a “Submit” button which your user will click when they’re done filling out the form. You’re using the MVVM paradigm with the data binding. You tried adding constraints to the fields, but you want the validations to happen only when your users click the “Submit” button. We have discovered this little trick that might help you.

Most likely, you are using the @bind(…) method to bind your form fields to the View Model attribute, e.g:

<textbox value="@bind(vm.someAttribute)" constraint="no empty" .../>

We noticed that when we used @bind() in conjunction with a constraint on the field, the validation was triggered immediately, for example, when the cursor left the corresponding input field. Depending on your requirement, this might be acceptable, but in one of the project that we have with our client, we went the extra mile for our client and opted for a cleaner solution, which is to trigger the validation only when the user clicks the “Submit” button.

The answer is to break the @bind() into @load() and @save(), and make sure the @save() is called before the command which handles the “Submit” button, i.e:

     value="@load(vm.someAttribute) @save(vm.someAttribute, before='save')" 
     constraint="no empty" .../>

<button label="Submit" onClick="@command('save')"/>

Note that the @save() expression has before=’save’, which matches the name of the ‘save’ @command() handler. This way, the validation is invoked just before the ‘save’ command, and the invalid input pop message is only shown at that time.

That’s it for now. We hope this tip helps someone out there with the same situation.

A little bit about us, NextCoder is a team of data analysts, software architects, and developers.  Using our up-to-date skills and experience, we help businesses make profitable decisions while increasing their capacity to grow. We combine Business Intelligence methodology with our vast software development experience to provide effective and unique solutions for our clients. Some of our products includes:

Tutoring Metrics

Team Tag 24

Hands-on Review of Bands in iReport

Posted by Esteban Martinez on August 19, 2014  /   Posted in Online Platform, Web Development

Here at nextCoder, we regularly use the JasperReports reporting engine and the iReport report designer tool in the systems we build for our clients. One of the issues I’ve noticed is that the iReport Ultimate Guide has lots of great technical info but doesn’t address most of the issues that come up in my real-world usage of the tool.

So I’ll be writing about some of tips and tricks that we here at nextCoder use with iReport. There’s a bunch of stuff to cover so I’ll deliver the goods in 3 separate articles. So lets get part 1 started with understanding the basics of all those report bands within the template, which will help with some creative reporting!

General Assumption
I assume that you are somewhat familiar with how iReports work, I will be glazing over some terminologies and concepts that I consider basic.  If you would like for me to go deeper on some of these, that’s what the comments box is for down there.

Title Band:
Meant for the title of the report. Intended to only print once and lacks any iteration properties.

Page Header:
Meant for printing on every page. Designed for keeping track of where you are in a multi-page report or to appear on a page when particular trigger has been fired. For example, if you have an accounting report for business expenses, there will be a section that will have employee costs. So in the header, you would show that this page is reporting employee costs. Then when
the report changes to reporting the utility expenses, the header would change to reflect this.

I usually have Static Textboxes for keeping track of the Page Header. A variable from a parameter could be used, however, if your information changes mid-page the Page Header will not show this. It’s often simpler to make a new sub-report if you have new Page Header information.

So in our example, the report would finish somewhere on the page reporting the cost of employees and leave the rest of the page blank. Then the new page would start with the new Page Header and start showing the costs of utilities. An easy way to ensure that a sub-report will start on it’s own page is make sure that the actual sub report (NOT the sub-report element ‘graybox’) has a page height of a full page. For 8.5 x 11″ this is 792. You can see this information by selecting the name of the report at the top of the list on the left hand side.ReportName

A secondary use of the Page Header is as a notification or alert. An example would be of a project exceeding a budget. In this case you would not always want the band to print. We can control this with the PrintWhen property of the band.

PrintWhen So the expression would look similar to:

$F{current_expense} > $P{project_budget}

Put in your notification text in the textfield and now this message will only print when the project has exceeded costs. Also great use for inventory too high or low.

We here at nextCoder we love the PrintWhen control!

TIP: There is a PrintWhen control for individual textboxes, a frame, or the entire band. This can be a real life-saver if your report has to dynamically change in accordance to user choices/selections.

Column Header:
Simple Static Text boxes that will print at the top of a column and will reprint again on the next page.

TIP: If you drag a field from the list on the left hand side of iReport into the detail band, a corresponding column header will be generated automatically in this band.


Detail Band:
This is where the majority of your report will take place. The most important aspect of the Detail Band is it will iterate through data automatically. So if you have a field called $F{employee}.getSalary(), then it will access that list of employee salaries and start listing them until it reaches the end.

NOTE: If you are using a sub-report, then it will be the band in which the actual sub-report is being processed that will determine iterating behavior. So if the parent report wants a complete list of a set in the title band (or any non-iterating band), then place the sub-report element in the title band. But make sure that the child(sub-report itself) is using the detail band to
iterate through the data.

Column Footer:
This band is meant mainly for keeping track of a total for a column of a page. It can also be used for keeping a running total if the report is spanning several pages for that column.

Here at nextCoder, we typically create a variable for this and give it a Calculation of Sum and Reset Type of Report. This will give me a running total for the report on each page. Use the Increment Type to update the variable when you like. So if I want the new total at the bottom of every page, I would select Page for the Increment Type.

Page Footer:
This band is used to repeat values at the bottom of every page. Typically used for Page X of Y information and a good place for the date. Both of which you can simply insert from the Palette Tools section in iReport and drag a box into the band.

NOTE: To open Palette, select ‘Window’ from menu and then ‘Palette’ or Ctrl + Shift + 8 Paging and Date utilities will be in the ‘Tools’ section.

Last Page Footer:
This band will print only on the last page of a report. Typically used for signaling the end of the report with a Static Text box.

Summary Band:
The main purpose for this band is to report out totals for the entire report. Will only print out on last page of report. If you have been keeping track of running totals with variables, or simply want to print a final total for the report, this is where they should go.

NOTE:  Variables should have their Reset Type set at Report. Otherwise you may not have all the data in the variable.

No Data:
This band will only print when enabled and if the report does not recieve data to process. To enable the band, Go to the properties of the report(Usually I just click on the report name at the top of the list on the left hand side), and find the section “When No Data”. Then select “No Data Section” from the drop-down list.


Put in whatever Static Text you want into this band to signal that no data was sent to it. Good for debugging reports and sub-reports.

I hope this has given you a good overall feel of the different bands in Jasper Report and their practical, real-world uses.

See you next time when I’ll be covering the most powerful, yet most misused and misunderstood feature of the engine: Sub-reporting. We are going several levels deep!

-Esteban Martinez

Senior Programmer at nextCoder

We serve businesses of any type and size
Contact Us Today