Java

Reading XML with jQuery

How to use the common jQuery JavaScript library to parse XML data sources, and to integrate them into your pages.

Using JavaScript to Style Active Navigation Elements

I’m all about efficiency when I’m writing web code. Any time I find myself writing the same functionality more than once or twice, I try to consider whether my repeated code could be wrapped into a function of some sort. Navigation is often one of those areas where I try to improve my efficiency.

Inline Validation in Web Forms

Inline validation gives people several types of real-time feedback: It can confirm an appropriate answer, suggest valid answers, and provide regular updates to help people stay within necessary limits. These bits of feedback can be presented before, during and / or after users provide answers.

JavaScript MVC

While MVC is a familiar term to those in back-end application development—using frameworks such as Struts, Ruby on Rails, and CakePHP—MVC’s origin in user interface development lends itself to structuring client-side applications. Let’s examine what MVC is, see how we can use it to rework an example project, and consider some existing MVC frameworks.

The Yahoo! User Interface Library

The YUI Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML and AJAX. YUI is available under a BSD license and is free for all uses.

JavaScript Cheat Sheet

This cheat sheet is logically organized into DOM methods, functions, regular expressions, etc. It’s easy to use and a great reference for all common JavaScript uses. The guide is not only excellent for JavaScript beginners (covering items as basic as the syntax for putting JavaScript into HTML) but is also suited to programmers at an advanced level (referring to more advanced JavaScript functionality).

Siete Impresionantes Sistemas de Navegación en jQuery

Ayer os presentaba dos excelentes galerías de proyectos desarrollados en jQuery. Hoy, para no ser menos, vamos a seguir hablando de jQuery. Lo que ahora os presento es una recopilación de 7 sistemas de navegación que nos os dejarán indiferentes.

Combine JSONP and jQuery to Quickly Build Powerful Mashups

With the number of publicly offered Web service APIs, it's now much easier to get content from different Web sources and to build mashups—if you have access to the right APIs and tools. Discover how you can combine an obscure cross-domain call technique (JSONP) and a flexible JavaScript library (jQuery) to build powerful mashups surprisingly quickly.

Building Mashups with JSONP, jQuery, and Yahoo! Query Language

In the previous article of this series, we introduced JSONP (JSON with Padding) as a way to overcome browser same-origin policy limitations while combining and presenting data from third-party sources. This article continues this process and shows you how to use Yahoo! Query Language (YQL), a JSONP service from Yahoo!, to build a mashup Web page using jQuery.

Regular Expressions for Client-Side JavaScript

Here is the syntax for a very powerful and very cryptic string pattern matching scheme in the client-side JavaScript of web browsers. You can use it to validate form entry, parse URLs, and many other things.

jQuery Embedded in Dojo Accordion Panes

We will experiment embedding jQuery in DOJO 123's Accordion widget and try to identify if there exists any cross-code interactions. The code is also tested for cross-browser suitability.

Advanced Debugging with JavaScript

When used effectively, JavaScript debuggers help find and squash errors in your JavaScript code. To become an advanced JavaScript debugger, you’ll need to know about the debuggers available to you, the typical JavaScript debugging workflow, and code requirements for effective debugging. In this article, we’ll discuss advanced debugging techniques for diagnosing and treating bugs using a sample web application.

ECMAScript for XML (E4X): A Simpler Programming Model

Developing software to create, navigate and manipulate XML data has become a significant part of almost every developer's job. Developers are inundated with a wide variety of data encoded in XML, including web pages, web services, deployment descriptors, configuration files, project make files and a variety of XML vocabularies for vertical industries (from purchase orders to target lists).

Helpful Hyperlinks with JavaScript

There you are happily surfing a web site; you click a link and suddenly find yourself at another site being asked to download a file. What happened there? Annoying, isn’t it? There has to be a better way to indicate to your visitors where a link is going and to what type of file. So, to help solve this little annoyance, I’ve written a bit of JavaScript and CSS that adds pretty little icons after the links—depending on the file extension and location—to indicate to the user the type of document they’re about to load.

Parse a String Using JavaScript

A handy trick for Web Developers in the ability to parse a string to check for a given substring. In plain English, this means checking if a word or part of a word is contained within text. This tutorial demonstrates how to do this using JavaScript.

jQuery and JavaScript Coding: Examples and Best Practices

When used correctly, jQuery can help you make your website more interactive, interesting and exciting. This article will share some best practices and examples for using the popular JavaScript framework to create unobtrusive, accessible DOM scripting effects. The article will explore what constitutes best practices with regard to Javascript and, furthermore, why jQuery is a good choice of a framework to implement best practices.

Extending The JavaScript Date Object with User Defined Methods

Applications, particularly business applications, can often require a lot of date manipulation, but that code could be simplified if JavaScript’s core Date object had some additional methods. In this article, I will show you how to add custom methods to the Date object that are inherited by each date instance.

Issues When Working With AJAX

This paper covers the main stumbling-blocks you're likely to come across with AJAX: instantiating the necessary JavaScript object, building the request, and using the response.

Creating Modular Interactive User Interfaces with JavaScript

Discover a technique that lets you move sections of a Web page using drag-and-drop functions. Different aspects of the interactivity are implemented separately and then composed into a unified whole, allowing for flexible customization that can make your Web users very happy.

Using Capability Detection

Browser name sniffing, using scripts figure out which browser is used and then provide different content to them, is a widespread practice with a long history. Unfortunately these scripts are usually static, while browsers keep evolving.

Replacing NOSCRIPT with Accessible, Unobtrusive DOM/JavaScript

Modern user agents with JavaScript enabled will hide content contained within NOSCRIPT, and reveal it when JavaScript is disabled. User agents that do not support JavaScript will display the content within it. User agents with partial/antiquated JavaScript capabilities however interpret the element correctly and do not show the content, but when JavaScript is disabled also do not show the content - it never gets seen. This has an impact on the accessibility of the content. If your writing is targeted at modern, standards-based, compliant, and fully capable JavaScript user agents, employing the NOSCRIPT element is no problem. If the user agents among your audience are unpredictable, however, replacing the NOSCRIPT element with another mechanism becomes significant. This article looks at one such solution.

JavaScript Badges Powered by JSONP and Microformats

Using a bit of JavaScript, a nifty way of making remote web service calls (JSONP) and a few microformats, I can display information from one service somewhere else, leaving me with only one place to update it. In this article you're going to create a JavaScript badge that can be added to any site and which will display relationship data from a service which exposes it

The Seven Rules of Unobtrusive JavaScript

I've found the following rules over the years developing, teaching and implementing JavaScript in an unobtrusive manner. They have specifically been the outline of a workshop on unobtrusive JavaScript for the Paris Web conference 2007 in Paris, France.I hope that they help you understand a bit why it is a good idea to plan and execute your JavaScript in this way. It has helped me deliver products faster, with much higher quality and a lot easier maintenance.

Choosing a JavaScript Framework

once you’ve decided that using a JavaScript framework is appropriate for the task you’re faced with, it can be hard to choose the one that is right for you. And to make things worse, what is right for you may not be right for your co-workers.

How to Choose a JavaScript Framework

A JavaScript framework may not make you a better programmer, but it will make you more efficient. That alone should be reason enough to choose a JavaScript framework, or library if you prefer. Unless you decide to build your own, there are plenty of options available to developers. However, choosing the right framework can be tricky, and weeding through a mess of opinionated fanboys (myself included) is intimidating.

The Rules of Unobtrusive JavaScript

One of the most important things to keep in mind when writing JavaScript for the Web is to make it unobtrusive, since You cannot rely on JavaScript being available.Sadly, there are many developers who do not seem to spend any energy at all on considering how to do that. Instead they choose to blindly forge ahead and assume that everybody who comes visiting will have full support for JavaScript and use a mouse.

How to Create an Unobtrusive Print this Page Link With JavaScript

When a client requests that I duplicate functionality that should be (and is) handled by web browsers, I always try to avoid doing it by explaining why I believe it is better to leave such functionality to the browser. Most of the time I succed, but occasionally I don’t.

Avoid the Void

There are plenty of occasions when coding JavaScript events where you simply need to call a function, for which an entire event registration model is too lengthy. The most commonly used method is to bind your event to an anchor link. The user clicks and the onclick event is fired, calling a reference to a function. Because the user isn’t actually visiting a URL, something has to be done with the href attribute.

Mastering JavaScript — Concept and Resource Guide

There is not a single interpreted language used today that causes more excitement, confusion, disdain, and conflict than JavaScript. The language is so incredibly flexible that it is difficult to separate a developer’s choice of coding style from JavaScript best practices.

JavaScript Shorthand Tips and Tricks

There is no official ECMAScript or JavaScript language feature called “shorthand”. Developers are responsible for coining the phrase, probably after realizing that terms like Ternary Condition are a bit archaic. The Mozilla Core JavaScript Guide does an excellent job of highlighting many of these shorthand techniques throughout tutorials, but I thought it best to have a definitive list all in one place.

Core JavaScript 1.5 Guide

Getting started with JavaScript is easy: all you need is a modern Web browser. This guide includes some JavaScript features which are only currently available in the latest versions of Firefox (and other Gecko powered browsers), so using the most recent version of Firefox is recommended.

Will You Need a JavaScript Framework on Your Next Project?

One of the pitfalls of using a JavaScript framework, especially among beginners, is the ability to quickly lose sight of what is specific to the framework, and what is specific to the core JavaScript language. However, as bandwidth constraints continue to dissolve, and browser compatibility issues erode, it makes sense to consider a framework on each project. Whether or not you actually use a framework after these considerations are made, is totally up to you.

Perma-Closing Message Boxes with JavaScript + CSS

Earlier this week I talked a bit about message boxes – how to style them and position them on your page to get them noticed. But a message that pops up every single time your website is loaded could get annoying. It’d be useful to give your users the ability to close those messages. For that, we’ll turn to our friend JavaScript.

The Importance of Maintainable JavaScript

JavaScript is hip again; there’s no doubt about it. But if you’re starting to get down and dirty with it, there’s no excuse not to keep it clean.

Setting and Retrieving Accesskeys with JavaScript and DOM

There are some things in the world of accessibility that appear, on the face of it, to be really wonderful ideas… until you scratch slightly below the service. What may seem feasible when putting together some guidelines on accessibility might not ultimately translate well to a real-world application. Hands up who can remember the last time they felt compelled to use a longdesc attribute? And what about the accesskey attribute? Oh, you have used them you say. OK, let’s back up a little and find out what went wrong here.

jQuery Crash Course

As developers, we have more and more JavaScript libraries to choose from and, of course, the option not to use any at all. Over time, we each tend to favor one method of coding over another. For those who'd like to learn more about jQuery, one of the more popular libraries, here's a crash course written with code-savvy web designers in mind.

If I Told You You Had a Beautiful Figure...

Lay out images consistently across your site using a liitle clever JavaScript.

Integrate XForms with the Google Web Toolkit, Part 1: Introducing GWT's JavaScript Native Interface

This four-part series demonstrates how to use the Google Web Toolkit (GWT) and XForms together to create a dynamic Web application.

Manipulate XML Service Definitions with Java Programming

A Service-Oriented Architecture (SOA) typically exports a range of services. For XML service modelling and subsequent consumption of those services by users (people, machines, or other services), Java technology provides powerful mechanisms to handle XML data, which in turn provides a key foundation for using SOA concepts. Dive into the practical aspects of SOA using XML and Java technology, and discover clear examples of why this seemingly complex technology is so popular.

Embedding Hamlets

The open source Hamlets framework can help aid your Web development and properly separate content from presentation. The OSGi framework provides an excellent tool for development on embedded devices. Together, the two frameworks work as a team to provide browser-based interactivity to the humblest gadgets -- such as the lowly coffee maker. Read on to find out how it works.

Opening PDFs in a New Window with JavaScript

Learn how to use unobtrusive JavaScript to automatically open all PDFs in a new window.

Striped Tables Using JavaScript

Find our how to use unobtrusive JavaScript to make striped tables with different backgrounds on each row.

Battle of the Wizards: Dojo Vs. Microsoft

Two wizards are compared. One client script from DOJO and the other server component from Microsoft. Both fo them work exceedingly well in IE 7.0. Dojo wizard looks smashing.

JSON Basics

These are the golden days of JavaScript, which was warily used in the not too distant past because of the browser wars (still being waged). With enhancements to JavaScript in recent years and the advent of AJAX, interest in Javascript has taken a new turn, a turn for the better. Early on with AJAX it was recognized that there was a contender for XML for handling data which was stable, faster, and portable. This was the beginning of JSON. This article gives you a good explanation.

Leveraging AJAX and JSON using Dojo Tool Kit

This article shows how AJAX calls are made using the JavaScript extensions developed by the Dojo foundation to retrieve data using the JavaScript Object Notation (JSON)and displaying the results on the browser.

Build Web apps with ThinWire and Java code, Part 2: Using the SplitLayout Class

With ThinWire, an open-source development framework, you can build Web applications that look and feel like desktop applications. In this five-part series, you'll learn how to develop rich Web applications using ThinWire and Java. In Part 2, you learn to use the SplitLayout class in conjunction with your own layout management code to dynamically change the layout of a ThinWire GUI based on the current size of the Web browser window.

Crossing Borders: JavaScript's Language Features

JavaScript is often ridiculed as the black sheep of programming languages. The development tools, a complicated and inconsistent document object model for HTML pages, and inconsistent implementation in browsers contributes to that sentiment. But JavaScript is much more than a toy. In this article, Bruce Tate explores JavaScript's language features.

The Geronimo Renegade: Web 2.0 Report Card

Web 2.0 is still one of the computer industry's hottest buzzwords, despite widespread disagreement as to what the term actually means. This month, The Geronimo renegade cuts through the hype and looks at the Apache Geronimo project as both an enabler of Web 2.0 applications and as a Web 2.0 application itself.

How to Validate Forms with JavaScript

Discover why and how you should use unobtrusive JavaScript to validate forms.

Increasing Form Usability with JavaScript

It's easy to increase the usability of forms using JavaScript - find out how.

JavaScript and Progressive Enhancement

Learn about JavaScript and how it can be used to progressively enhance your site.

Accessible Java using JAAPI

Due to the proliferation of Java applications and applets on the Internet, it is essential that accessibility barriers are not introduced during their development.

IBM Servlet-Based Content Creation Framework

This framework provides an easily-used and easily-understood way of developing Web-based applications. The framework not only supports but also enforces the complete separation of content and presentation. Its simple and elegant design does not hide the familiar underlying servlet infrastructure.

Introducing Hamlets

Servlets are a key component of server-side Java development, but despite a number of attractive traits, servlets do not support or enforce the separation of content and presentation. To master that functionality, Rene Pawlitzek proposes Hamlets -- servlet extensions that provide this functionality within a lightweight framework implemented with less than 500 lines of Java source code.

Compiling Hamlets

Rene Pawlitzek continues to advance the Hamlets framework, which extends Java servlets and enforces the separation of content and presentation. In this article, he proposes a new refinement: a method of compiling Hamlet templates that can improve application performance.

Access Key, HTML Accesskey Generated by JavaScript

One of the great advantages of using first letter of the link text as access key is that it can be generated by code. Conventional wisdom states that it should be done server-side. Bad that it is much easier with JavaScript.

JavaScript Basics for Prototyping

I know there are a good number of designers out there afraid of anything that smells of programming (basically, if it's not plug and play, it's not being used). I completely understand. Dealing with CSS rending across browsers is bad enough already. Because prototypes are all about making an interface 'look' like it works, the dabbling we're going to go over here is actually a process that's amenable to designers (especially those with programming skills that started off as just rudimentary hacking skills). CSS is the domain that most of the new crop of web designers are most comfortable with and so the functions we're going to go over are ones that manipulate, for the most part, the styles of our elements.

Make Internal Links Scroll Smoothly with JavaScript

When they’re navigating through a long document, users often are confused or disoriented when they click a link that jumps to another location in that same document.

JavaScript 101, Part 1: The Basics

One of the primary aspects of effective web experiences is interactivity. Although most Flash developers will try to state otherwise, the reality of the fact is that the majority of non-standard interactivity, that is interactivity beyond what the broswer provides automatically, is driven by JavaScript. Over the last few years the acceptance of both standards and some new JavaScript technologies such as XMLHttpRequest, or AJAX to the masses, has opened up a whole new realm of possibilites that have helped to bring JavaScript back into the mainstream focus as an important and leading-edge technology. The purpose of this series of articles is to introduce newcomers to the concepts and fundamentals of JavaScript, so that you can begin to leverage the power of this technology in your own web projects.

Spell Checking HTML Forms with JavaScript and PHP

Have you ever had to write a large amount of text into a field on an HTML form and been uncertain of just how reliable your spelling skills are? Wouldn't it be nice if HTML forms, like most other applications, had one of those handy little 'Spell Check' buttons? In this article we'll look at how easy it is to implement this functionality using a PHP/JavaScript solution called Speller Pages.

Heading Navigation Greasemonkey User Script

This is a Greasemonkey user script to enable heading navigation in Firefox. Headings can either be navigated by the heading level, for example, all h2 elements, or by any level.

Painless JavaScript Using Prototype

Prototype is an object oriented JavaScript library (written by Sam Stephenson and friends) that makes JavaScript fun. So it says on the site, anyway. Those of you who are familiar with the open source community's latest and greatest application framework, Rails, may recognise Prototype as it actually forms the backbone of Rails' JavaScript helper. However, Prototype can be used independently of Rails to aid the coding of many JavaScript doodads and Web 2.0 thingy wangles.

Writing Documentation and Help for Eclipse Projects and Plugins

Eclipse is an open-source community. One of its primary projects is the creation of 'an extensible development platform...for building software.' This platform takes shape in the Eclipse workbench, a Java-based IDE (Integrated Development Environment).

Implementing Hamlets

The Hamlet framework was developed to extend Java servlets and enforce the separation of content from presentation. In this article, you'll find an additional way to provide dynamic content as René Pawlitzek advances the framework further and refines use of the template engine.

Exploring Footers

With old-school table layout methods, vertical positioning is a piece of cake. With CSS layout, it's a piece of something else. New ALA contributing writer Bobby van der Sluis shows how to regain control of footers and other vertically positioned layout elements via CSS, JavaScript, and the DOM.

Accessibility Tutorial

Developers put a lot of effort into ensuring their sites can be viewed in outdated browsers, but all too often ignore newer browsers, or worse still, a whole range of visitors. Accessibility means access to information for all. Information to all, regardless of the device used to view the document, or abilities of the visitor. You're extremely proud of your latest masterpiece. The choice of colours is striking, the layout fits perfectly on your screen, but how does it look on a Personal Digital Assistant (PDA)? How does it look to a colour-blind visitor? Does it read correctly using assistive technologies, such as screen reading software? Can a visitor navigate the site without the use of a mouse? Is the site usable when JavaScript and images are switched off in the browser?

Using JavaScript to Develop Interactive Self-Assessments

Interactive self-assessments are effective tools for a variety of audiences; from determining one’s Myers- Briggs Type Indicator (MBTI) or personality characteristics to self-scoring quizzes of all types for online training. Many Web sites contain such selfassessments that help customers select from among other offerings the type of product or service that meets their requirements. The strategic design and development of interactive self-assessments can also help steer customers to your specific product line or service, or even help them make the decision to buy or award a contract. This paper looks at the effectiveness of self-assessments as a business tool and the use of JavaScript for supporting the interactive elements.

Tutorial: Introduction to JavaScript

JavaScript is an easy-to-learn programming language which can be built into Web pages, so that it executes from within the browser rather than on the web server. Intranets especially can leverage the power of JavaScript to create 'smart' Web pages which can process data and interact with the user. In this introduction we concisely look at the main programming points of the JavaScript language.

Curbing JavaScript Dependency

JavaScript can be used as an enhancement, but too often it ends up rendering a page unusable to people who don't run it. There are a number of good reasons why it might not be running in a given browser, and pages should never depend on it. MSG is a 'flavor enhancer,' with one slight problem -- some people are allergic to it. Most people don't seem to care much either way, but a small number of people seems to have bad reactions to it. If you ask people in the industry who sell it, they'll tell you it's quite safe, but there are others who claim that it's potentially lethal to some (very, very few) people.