Alexandru Dinulescu's Thoughts

Hello

In this post I will elaborate and add more functionality to a previous post of mine found here here. Basically i have added more functionality to the page, such as left / right key navigation, number key functionality, enter/escape key functionality, and of course the entire suite of conditions needed so the code works properly.

I have tried to build each functionality as a module, which you can add and remove, however in order to have the search function work well with the tab functionality and switching, then some interdependence was needed.

the XHTML

The XHTML is not different from the last version, the only thing different is a few bits and pieces of additions, and more importantly a couple of new lists so we can have a tab functionality. Other than that, there were no major changes.

the CSS

As with the first version this CSS is very basic however you can style it as you wish, probably in the future i may add some nicer styles to the project but for now, since it’s just a tutorial thingy, i think what we have is quite enough.

the JS

The JS suffered major changes, (of course right, we’re building a JS application here). It is kinda hard to explain everything in the post, but all the lines (almost all the lines) are heavily commented within the JS file itself, so please refer to that file for exact instructions and explanations.

The files can also be found online Here and a zip file can be downloaded from here

In part 3 of the series i will try to enlarge the search possiblity to include more than 1 letter