Site of the Day 8/17/2010

Another crazy language from the W3C 🙂

http://news.cnet.com/8301-30685_3-20014967-264.html?tag=topStories2

Site of the Day 6/23/2010

15 Great jQuery Plugins For Better Table Manipulation
 http://www.webdesignbooth.com/15-great-jquery-plugins-for-better-table-manipulation/

Site of the Day 5/27/2010

I’m glad I found this link when I was sitting down. 🙂

http://www.jsmag.com/

Site of the Day 5/26/2010

Here is a site concerning PaperVision3D.

http://blog.papervision3d.org/

Site of the Day 5/25/2010

James Ward has a page which will see if your page is Flex instead of Flash.

http://www.jamesward.com/is_it_flex/

How to do a type ahead for a select tag

I thought I would put some code here on how to do a type ahead for a select tag (select-one) using JavaScript.
*** WordPress made my “8” as a smiley face, so just replace it.

1.) Add these 2 event handlers to a given select tag.

onblur=”_dw_select_typeAhead_clear(); ”
onkeydown=”_dw_select_typeAhead(); ”

2.) Add this global variable to keep the status of the type ahead.

// global storage object for type-ahead info, including reset() method
var taInfo = {
last:0,
charsTyped:”,
chars_keyCode:”,
delay:1000,
timeout:null,
reset:function() { this.last=0; this.charsTyped=”;  }
};

3.) Add this function to initialize some global variables at the onchange event handler.

// ===============================
// clear variables for type ahead
//  ===============================

function _dw_select_typeAhead_clear() {

taInfo.charsTyped = ”; taInfo.last = 0;
} // end of type ahead clear…

4.) Add this function to show the location were the user is as they type the characters.

// =====================================
// type ahead for select drop down
// =====================================
function _dw_select_typeAhead() {

  var v_len = 0; var v_len1 = 0; var v_event = window.event;
  var txt; var charCode; var val;
  charCode = v_event.keyCode;

// escape key will clear the type ahead buffer and allow the user to start over
  if (charCode == 27) {
   _dw_select_typeAhead_clear(); // clear
 _dw_select_typeAhead_startover(); // options[0]
   v_event.returnValue = false; return true;
  }
  if (v_event && !v_event.ctrlKey && (v_event.keyCode > 19 || v_event.keyCode == 8 ) ) {
     var now = new Date();
     if (taInfo.charsTyped == ” || taInfo.charsTyped != ”) {
        var ddl = v_event.srcElement;
        taInfo.last = now;
     // correct for NumPad digits
     if ( charCode >= 96 && charCode <=105 ) { charCode = charCode – 48;   }
     if ( charCode > 127 ) { charCode = charCode – 144; }
     if ( charCode == 8 ) {
        v_len1 = taInfo.charsTyped.length – 1;
        taInfo.charsTyped = taInfo.charsTyped.substr(0,v_len1);
     } else {
           taInfo.charsTyped += String.fromCharCode(charCode).toUpperCase();
     }

window.status = taInfo.charsTyped;
  ddl.title = taInfo.charsTyped;
     v_len = ddl.options.length-1;
        for (var i=0; i < v_len; i++) {
         txt = ddl.options[i].text.toUpperCase();
      val = ddl.options[i].value.toUpperCase();
            if ( txt.indexOf(taInfo.charsTyped) == 0 && val != “” ) {
            ddl.selectedIndex = i;
         break;
         } // if dd1
      } // for_i
      } // if taInfo
      v_event.returnValue = false;
      return true;
  } // if v_event

  return true;
} // end of select type ahead….

5.) I’ve added the capability to clear all of your typed characters by use of the Escape Key.

// =====================================
// escape key : clear type ahead character
// =====================================
function _dw_select_typeAhead_startover() {
 
var v_event = window.event;
var ddl = v_event.srcElement;
ddl.options[0].selected = true;
window.status = ”;  ddl.title = ”;  
} // end of type ahead start over….

Site of the Day 5/24/2010

Flex on Google Android in Flash Player and AIR

http://www.jamesward.com/2010/05/21/flex-on-android-in-flash-player-and-air/