www.webdeveloper.com
Results 1 to 4 of 4

Thread: [RESOLVED] onkeypress works in Firefox, not I.E.

Hybrid View

  1. #1
    Join Date
    Sep 2008
    Location
    Jackson MS
    Posts
    373

    resolved [RESOLVED] onkeypress works in Firefox, not I.E.

    I am trying to get the following to work in a timesheet page:
    Code:
    document.onkeypress = keyHit;
    function keyHit(evt) {
    var e = evt || window.event;
    if (document.timeform.DeBugging.checked==false) {
      j=1;
      return true; }
    if (e.keyCode == 40) {
      if ( j < 79)
         j+=8; 
      document.timeform.elements[j].focus(); }
    if (e.keyCode == 38) {
      if ( j > 7)
         j-=8; 
      document.timeform.elements[j].focus(); }  	 
    	
    if (e.keyCode == 13) {
      if (j == 0) {   // Override of date
        datePopulate(); }
      else {
        var jmod = j%8;
        if (jmod == 2 || jmod == 5) {
          calculate();
        j = (jmod == 2)? j+1 : j+3; } }
      document.timeform.elements[++j].focus();  
    }
    return true;
    }
    but it only works in Firefox. My inspiration from a sudoku solver looks like this, but it does work in Internet Explorer.
    Code:
    function gridKey(oInput, evt)
    {
    	var e = evt ? evt : window.event;
    	// check for arrow key
    	
    	var dx = 0; 
    	var dy = 0;
    	
    	switch ( e.keyCode )
    	{
    		case 37: dx--; break; // left arrow
    		case 38: dy--; break; // up arrow
    		case 39: dx++; break; // right arrow
    		case 40: dy++; break; // down arrow
    		case 13: dy++, dx=100; break; // return key
    		default: return;
    	}
    	var sID = oInput.id.substring(7);
    	var a = sID.split('_');
    	var y = parseInt(a[0]);
    	var x = parseInt(a[1]);
    	
    	if (dx == 100) x = 0; else x += dx;
    	y += dy;
    	var oInput2 = document.getElementById('sudoku_' + y + '_' + x);
    	if ( oInput2 ) oInput2.focus();
    }
    SudokuPuzzle.prototype.displayInputCell = function(i,j)
    {
    	var value = this.grid[i][j];
    	if ( value == ' ' ) value = '';
    
    	var id = 'sudoku_' + i + '_' + j;
    	return '<input style="width:30px" id="' + id + 
    			'" value="' + value + 
    			'" onkeydown="gridKey(this,event);">';
    }
    The full pages are timesheet.htm and sudoku.htm respectively.

    TIA

  2. #2
    Join Date
    Feb 2014
    Location
    Canada
    Posts
    155
    Just from first glance, there's a large problem with timesheet.htm, namely in that document.timeform is incorrect syntax. IE is not very forgiving, whereas other browsers are more forgiving and probably can make sense of what you're trying to do.

    Code:
    // change document.timeform to either:
    var myForm = document.forms[0] OR document.forms['timeform'];
    
    // to get an element from this form:
    myForm.elements[j]; // for your for loop
    Also, you have your event handler stored as var e (slightly unusual naming convention) but if this is going to be a reasonably large project, normally you'd also use a target handler. I'm not sure if you have one elsewhere in your code but not in the snippet.

    The sudoku solver snippet that you provided seems correct and since there's over 400 lines of JS for it, if there's something wrong, could you narrow down the block of code? I'm guessing you're just showing it for inspiration, however, a word of caution is prototype with DOM can be a bit of a headache. IE will likely extend this to a full-blown migraine (newer versions of IE might not) but you're going to have to do a lot of debugging and testing if you want to pull off that sudoku solver or something similar using prototype.

  3. #3
    Join Date
    Mar 2009
    Posts
    501
    There are a lot of cross-browser issues with key events. See:

    http://www.quirksmode.org/js/keys.html

  4. #4
    Join Date
    Sep 2008
    Location
    Jackson MS
    Posts
    373
    Changing it to "onkeydown" seemed to do it as the quirksmode website suggested--that was the same thing as in the sudoku puzzle. Guyon Roche wrote the webpage--I only have a few tweaks in his code such as color changes and allowing the Enter key to go to the leftmost cell on the next line. I'll use it for real on March 9, just in time.

    Thanks for looking at it.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles