Posts In "Javascript"

This post I compiled some examples I found for creating image gallery in mobile web, cause compared to web desktop, creating image gallery in mobile devices must be different, we have to thinking about limited screen resolution, supported event, etc. And these library & tutorial might help you to get started creating your own mobile web gallery, and some of them a have tried it on my local computer, using iPhone simulator.

Photo Swipe

PhotoSwipe is a free HTML/CSS/JavaScript based image gallery targeting mobile devices, demo.

There are many javascript framework that available to use on the internet, most of them offering a simple solution to build modern web application, but not all offering a full rich UI component. Some framework like jquery, mootools, prototype only cover the core feature like animating, effect, DOM manipulation.

This rich feature whether you called it component, widget or any other, can help you to make user interface faster, without have to write your own style. These might be help if you build an enterprise web application. I list some of javascript framework with rich that maybe can be one of your choice. 

In this sort post I want to share how to detect keyboard input character using jquery, basically this is very simple cause JQuery have already built in keypress() event, we just need to get the callback parameter properties, let get through the code

$(document).ready(function() {
    $("#field").keypress(function(event) {
        alert(event.charCode);
    });
});

The code above used to get the character code from the input keyboard, you can browse more the “event” callback parameter using console.log() function and browse the entire parameter properties using firebug in firefox or inspect element console in webkit browser,

console.log(event);

and to convert back to character, simply using this javascript code.

String.fromCharCode(charCode);

This is just my simple post, I want to moving a box to random position inside it container, I post this to help me remembering this for my little project. If I sketch it, basically this sample is like this:

Then convert this to html, just simple div inside div and the difference are id and the css style, and there is one button to triggering the movement of the box inside the container

Day by day, web application framework make our development easier and faster, with the growing of mobile devices such as smartphone and tablet pc for browsing the web, the web framework need to meet the difference screen for each devices, different user experience. These are the list of framework (well not all actually a framework) that can be choosen by you for developing mobile web application, some provide full user interface and some only provide a basic framework.

Creating ajax upload from a raw javascript or jquery is not that simple, when baking a simple website, I personally will use available plugin, so it can save me much time and effort, we have to thank that there a lot of developer out there that share their great works.

01. Plupload

In this post I try to share my code about form validation in EXTJS, so why another EXTJS form validation tutorial? well, the EXTJS default form validation is quite great, but most sample that I’ve found it just using client side validation and the only server side validation is when the user press submit button. So in this post the I modified a bit code about custom form validation in EXTJS, and here I’m not using database. The expected result should be like this

In this post I want to show some solution to build sorting table using Prototype Javascript Framework, although the library is not really popular right now (maybe because of Jquery), the community is still live. Most of this script using default style, of course you can customize it.

1. Table Orderer

Demo | Download

ExtJS is one of the most popular javascript user interface framework, it offer a bunch of great user interface component, if you are a Java Programmer it better you use the Ext-GWT, but if you are a web programmer who always using web scripting language such as PHP, it may be painless if you learn the new web interface beside the traditional HTML, but i did it and mix it with Codeigniter in purpose to create and maintain better PHP code, and it’s not really bad and here some advice I have for you :

1. Follow the examples

ExtJS come with a bunch of great sample use of using widget, this provide the basic use of the component, creating plugin, etc. This is the best way to know what you can do with the component and how to implement the component by viewing the source code, if you somehow don’t understand what the code means, simply you can consult the API documentation first. Just download it first and run on your local server or you can view it online.