Aurelia – validation of dependent inputs

Form validation in Aurelia is actually pretty nice.
You can configure the validation rules in a chainable api and add multiple rules to single fields.

However there is a problem if you want to trigger the validation of an input when another input is filled. A good example are two inputs (a start value and an end value). Of course you want to validate that the start-value is less than the end-value. But if you add the rule to both fields only the edited field will show (and reset) the error message.
Ok… This explaination might be a bit confusing… Let’s consider the following example:

You have two inputs, ‘Start’ and ‘End’. End has to be greater than start. You type ’20’ as start and ’30’ as end. It gonna look something like this:

But suddenly you realize, the start should really be 50. Of course the validation will fail, and the start will be marked as invalid.
If you now change the value of end to 100, the start-input will still be marked as invalid, because only the input you are editing is validated and you haven’t told the validation that the inputs are dependent.

This is only an example of many other use cases. I’m sure you can think of other examples like two dates (I will show this in another blogpost, where I’ll tell you about some problems I had with the Aurelia materialize datepicker), or two inputs where only one should be filled and the other be empty.
Everything results in one problem: Validation of dependent inputs.

Continue reading

ASP.NET Core 2.0 Disable Authentication in Development Environment

This article describes how to disable authentication for ASP.NET Core 2.0.

ASP.NET Core JWT Authentication

I have some Rest API which I want to protect via JwtBearer token in production e.g.


However in order to test the API, for development I totally want to disable authentication without having to remove all Authorizes in the Controllers.

Continue reading

JSF ViewState Hack Attempt: java.lang.StringIndexOutOfBoundsException: String index out of range: -1 – com.sun.faces.renderkit.ServerSideStateHelper.getState (

Hack Attempt on JSF ViewState

This article explains why the error java.lang.StringIndexOutOfBoundsException: String index out of range: -1 in the class ServerSideStateHelper in the method getState (313) might be someone trying to hack your application server. It is getting quite technical in here… but bear with me… it’s really interesting. I also break down the actual attack to demonstrate what the attacker was trying to do.

Continue reading

Angular2 Internationalization (i18n)

When you build frontend interfaces for the web, you often have to provide support for different languages, locales and timezones (generally called internationalization or short i18n in computer science). With Angular2 you can use the module “ng2-translate” to provide browser language detection and to resolve internationalized text fragments. In this article I will show how to use language files for Angular2.

Include Angular2 translation module

The ng2-translate  module can be simply added to your project via npm by calling:

Next you have to add the module to your Angular2 application module, by including  TranslateModule  from ng2-translate :

import {NgModule} from ‘@angular/core’; import {HttpModule} from ‘@angular/http’; import {TranslateModule} from ‘ng2-translate’; @NgModule({ imports: [ BrowserModule, HttpModule, TranslateModule.forRoot() ], bootstrap: [AppComponent] }) export class AppModule { }

Provide Language files

By default, the ng2-translate module loads the translated texts in JSON Format from the path "i18n/*.json" , where "*"  is the selected language (de, en, …).

The translation keys are organized in a JSON hierarchy and can be grouped thematically with this feature. So take this example translation file:

There are now the translation keys “ExamplePage.Title”, “ExamplePage.Description”, “AnotherPage.Title”, “AnotherPage.Info” and “AnotherPage.Subsection1.SocialMedia” available.

You need to provide such a file for each language you want to support.

Use in your Angular2 application

In order to enable the translation feature, you first have to initialize the ng2-translation service in your application, e.g. in the initializer of your app component. You can configure which languages you support and which is the default language. You also can use browser detection to get the preferred language of your user agent.

To insert translated texts in your Angular2 template, simply use the “translate” pipe. Put the translation key as input of the pipe, then add “|translate”.

You can also query translations from the TranslationService directly (with the "get"  method), but be aware, that the translation resolution is asynchronous by default (because it could be required to fetch the translation file on the first encounter). Therefore queries of translations always return Observables, unless you force instant evaulation with the "instant"  method (which will fail if the language file is not loaded, yet).

WildFly 10 with Apache and AJP

This article demonstrates how inbound request from a webserver (Apache) can be proxied to an application server (WildFly 10) using the Apache JServ Protocol (AJP). For more information on what AJP actually is, take a look at .

WildFly 10 Configuration

First you have to add an ajp-listener to the undertow subsystem (line 4).

standalone.xml –  undertow subsystem:

Then you also have to add a socket-binding (line 4).

Continue reading

illucIT Software on Maven Central

We have decided now to publish our free Software package on Maven Central under the namespace “com.illucit“. This way the packages can be used by everyone without having to declare a separate repository in Maven or SBT.

This software packages also contain the software displayed in out Showcases:

Image Editor Component for PrimeFaces


Sourcecode on Github:

Maven coordinates:


High-performance prefix index and search word highlighter

Showcase Page:

Sourcecode on Github:

Maven coordinates:


Running Docker Containers

In the article Introduction to Docker I talked about the general purpose of docker – providing a platform to run software in a controlled environment. In this article I will show how to create Docker containers from images, running Docker containers and providing the required arguments.

To create a Docker container, you first need to decide which Image to take as a base. This will usually be a specific software solution (e.g. a webserver or a database server), or it can even be an empty base linux system (e.g. Debian Jessie).

Continue reading

Angular2 RC3 Router

Some days ago, the new Angular2 RC3 release candidate (and also some days earlies RC2) has been released. Again, some changes were made to the Angular2 structure that everyone needs to update in their Angular2 applications to become compatible to the new version. I want to show some of the changes in the new Angular2 RC3 Router in this article.

Angular2 RC3 Router

After the Angular2 Beta Router and the new Router introduced in RC0, yet another Router package has been released and the old one has bee deprecated (and is now still available as package @angular/router-deprecated version 2.0.0-rc.2). According to the team, the new router was necessary to handle some fundamental problems with the previous routing mechanism, which might be working correctly with 90%ish of the use cases, but was not able to handle all use cases Angular2 wants to address.

Although the new router package is official still in Alpha, it has been announced by the Angular2 team, that the new Router package should already be used instead of the old package.

Continue reading

Angular2 with NPM and Webpack

This article demonstrates how to set up an Angular2 project with Webpack. The setup also supports Typescript, Less, CSS packages like Twitter Bootstrap and Fonts e.g. FontAwesome.

It describes how to set up all the different plugins, loaders etc. I needed for a real Angular2 application. Most articles I read so far only concentrate on one small part of a complete setup. If you think I forgot to mention an elementary part of the setup, please let me know.

Required NPM Packages

All required dependencies for Webpack are put into package.json as devDependencies, so that NPM will automatically install them.

Continue reading

Angular2 Date Pipe

In Angular2 you can use “pipes” (in earlier versions called “filters”) to adjust data bindings to given situations. Then name comes from the “pipe symbol” (|) that is also known from Unix/Linux command shells to manipulate data streams. In Angular 2, the most common pipes are “date” (date format rendering), “async” (asynchronous data binding of Observables) and String-manipulating pipes like “uppercase” / “lowercase”. I will focus on the “date” pipe in this article.

Continue reading