Proof of concepts

Proving that we can use jQuery to push a dynamically generated file to the web browser based on the user's input

In order to demonstrate the possibility of using JavaScript/jQuery to push a dynamically generated file from the server backend to the browser, a sample scenario was created.

There is a number dial that changes rapidly and a text field for the user to enter his name. When the user clicks on the "get lucky number" button, jQuery is used to send the lucky number on the number dial and the user name to the server.

The server generates a text file based on the input from the user and sends the file back to the browser. The browser will then show a download dialog box for the user to decide whether to save a copy of the file or view the file using one of the native applications found in his/her computer.

Using jQuery to detect user checking and unchecking a checkbox

Demonstration of using jQuery to detect user checking and unchecking of a HTML checkbox.

Message will be hidden when the user checks the HTML checkbox and shown when the user unchecks the HTML checkbox.

Using jQuery to access the DOM structure of parent HTML webpage from within the child HTML window

This is a demonstration of how a child web page can access the DOM structure of its parent web page using jQuery and JavaScript.

It shows a button on the parent web page to spawn the child web page in a separate browser window.

The child web page provides a text field and a submit button to write user's input to the parent web page.

Adding HTML components dynamically with jQuery

This is a proof of concept of how jQuery is used to add messages to the web page dynamically.

Using jQuery to intercept form submissions and validate form input

This is a demonstration of jQuery being used for intercepting form submissions and validating user input. If user input is invalid, the form submission will not be allowed to continue.

Using jQuery to detect mouse clicks

This is a demonstration of using jQuery to detect mouse clicks.

Using jQuery to get mouse cursor coordinates when mouse moves

Being able to detect the mouse cursor coordinates when the mouse moves is one of the first steps of creating a interactive web page.

This is a demonstration of using jQuery to detect mouse cursor coordinates when the mouse moves.

Highlight HTML table rows when mouse cursor hovers over them with jQuery

When I look at tabular data on my web page, I always have the habit of pointing my mouse cursor at the row that I am focusing on.

To facilitate my reading of that table row, I will want the background of that row to be of a different color than the rest.

This is a jQuery proof of concept to highlight table rows when the mouse cursor hovers over them.

Sending message from Java applet to web page via jQuery

To incorporate Java applets into web applications, there can be a need for Java applets to send messages to the web page which they are embedded on.

This is a demonstration of how to do so.

Trying out jQuery with a game of Tic Tac Toe

Tic Tac Toe is an easy game to build with most programming language. Since putting the game on the web browser requires event handling and DOM manipulation, it was a perfect candidate for me to understand jQuery better.

Enjoy the game!

Validate field, on change, with jQuery

In many of the forms that I had built, I will almost always need to validate the fields when they are being changed.

This proof of concept showcase validating of some text input field when the value they contain had changed.