jQuery: How to Fix the IE Select Box z-index Bug

Posted by Jetlogs @ 12:01 pm
Category: Web Development, jQuery

Had you ever experienced the IE6 z-index bug where a simple select box will always take priority over any predefined z-indices and always show up on top? Ever annoyed to make a floating dialog only to have a select box underneath popup and ruin the dialog? Well you’re not alone…

Example of the Select Box Bug
I’m in your divs, ruining your z-index Read more »


jQuery: AJAX Tabs

Posted by Jetlogs @ 4:11 pm
Category: Web Development, jQuery

One of AJAX’s strengths is that it allows you to save bandwidth for your application by providing data on-demand instead of loading everything in one go. Because of this, some applications like the invisionboard has employed AJAX tabs on its user control panel. But have you ever wondered how to create one yourself? Well this article will show you how its done easily using jQuery. Read more »


jQuery: Disabled and ReadOnly Inputs

Posted by Jetlogs @ 12:22 am
Category: Web Development, jQuery

Ever wonder how to disable another input element through the use of another control? Here is a simple tutorial on how to toggle the disabled attribute of an input element.

For the first demo, we will toggle an input’s disabled status through the use of another control. For this example, we will give our target input an id of target, while our control, in this case a link, we will give it an id of control:

Target text field: <input type="text" id="target" /><br />
<a href="#" id="control" />Disable target</a>

Now to toggle the target’s disabled status, it is actually quite simple in jQuery. Using the .attr() attribute we can disable the target. Then using the .removeAttr(), we can remove the disabled status. Here is how the javascript code would look like:

$("#control").toggle(
function ()
{
	$('#target').attr("disabled", true);
},
function ()
{
	$('#target').removeAttr("disabled");
});

Here is a demo on how to toggle the disabled status of an input:

Target text field:
Disable target

Although the first method is handy, there are times when we really don’t need a control input. What if we want to enable an input textbox just by clicking on it? Unfortunately Read more »


Javascript Keypress Validations

Posted by Jetlogs @ 10:48 am
Category: Web Development, jQuery

Most client-side validation nowadays is usually made through onsubmit validations. Although it is pretty convenient, it may be quite annoying for a user to find only at the end that most of their inputs are invalid and must enter them once again. If onblur validations is not enough, keyperss validation is the next step.

Here is another alternative to the usual onsubmit validations for forms. Instead of validating a form only at the end, why not validate it as the user is typing their input. This is where keypress validations come in. We can capture it through the onkeypress event.

Here are some examples of keypress validations:

Only integers are allowed:
Only alphanumeric characters are allowed:
No spaces are allowed:

Here is an example keypress validation function: Read more »


Auto-saving with jQuery

Posted by Jetlogs @ 2:22 am
Category: PHP, Web Development, jQuery

Auto-saving has been one of the great features that AJAX has given to us. Ever had a time when you were writing a very long article and suddenly, your browser crashes. Thanks to applications that implement auto-saving, data is less prone from lost due to these cases.

Ever wondered how auto-saving is done? Basically, it is just a simple AJAX script running in the background at set intervals to save the data you are currently working on. Here is a simple tutorial on how to implement auto-saving using jQuery Read more »


« Previous PageNext Page »
  • Archives

  • Donations

  • Social Bookmarks

  • Jetlogs.org
    Some Rights Reserved 2007
    Creative Commons License