Opened 8 years ago

Last modified 4 years ago

#8382 confirmed Bug

[IE] PageUp and PageDown not working

Reported by: Satya Minnekanti Owned by:
Priority: Normal Milestone:
Component: General Version: 3.0
Keywords: IBM IE Cc: Damian, Teresa Monahan, rschnorenberg@…, giorgio

Description (last modified by Jakub Ś)

To reproduce the defect:

  1. Enter content in CK Editor that spans multiple pages.
  1. Press PageUp button.

Expected Result: Cursor in editor body moves one page up.

Actual Result: Cursor goes to start of page content.

  1. Press PageDown button.

Expected Result: Cursor in editor body moves one page down.

Actual Result: Cursor goes to end of page content.

Tested against IE8, IE9 & IE10

Change History (12)

comment:1 Changed 8 years ago by Jakub Ś

Status: newconfirmed
Version: 3.0.2

Paging has never worked in IE (7-9)

Effect described by @satya has been reproducible from CKE 3.0.2.

comment:2 Changed 7 years ago by NicHolt

This is an M$ browser "feature" in IE7 onwards which only occurs when the element to be scrolled is contentEditable.

Here's a workaround, in the wysiwygarea plugin. It emulates scrolling up and dowm, rather than Page Up and Page Down - i.e. the caret is NOT moved. However, for those that prefer keystrokes to mouseclicks, it's a huge improvement on the M$ "feature".

if (env.ie && (env.ie7 || env.ie8)) {  // And IE9? though I can't test that
	var docEl = editor.document.$.documentElement;
	var scrTop = docEl.scrollTop;
	var scrHgt = docEl.scrollHeight;
	var winHgt = editor.document.getWindow().getViewPaneSize().height;
	
	if (keyStroke == 33) {  // Page Up
		docEl.scrollTop = Math.max(scrTop - winHgt, 0);
	}
	else {                  // Page Down
		docEl.scrollTop = Math.min(scrTop + winHgt, scrHgt - winHgt);
	}

	evt.data.preventDefault();
}
else {
	setTimeout( function ()
	{ 
		editor.getSelection().scrollIntoView();
	}, 100 );
}



comment:3 Changed 7 years ago by Garry Yao

Thanks for the feedback, we would plan the fix of this issue in V4 eventually.

comment:4 Changed 7 years ago by Jakub Ś

We had almost the same ticket reported and it was marked as won't fix - http://dev.ckeditor.com/ticket/6147#comment:2
Perhaps there will be a fix for it in v4 with usage of the idea reported by @NicHolt or some other trick but please keep in mind that browser will not be very helpful here.

comment:5 Changed 6 years ago by Rick Schnorenberg

Cc: rschnorenberg@… added

comment:6 Changed 5 years ago by Jakub Ś

#12549 was marked as duplicate.

I have checked this issue in native elements - iframe pointing to HTML5 page with body set to contenteditable="ture".

In IE8-10 there is no scroll. CKEditor works better as it at least moves the content to area where cursor is.

In IE11 there is a scroll but there are issues (same as in native environment) - you won't scroll on pageDown if you have focused an image in H1. I have also noticed that paging was blocked once you reach table.

comment:7 Changed 5 years ago by Jakub Ś

Description: modified (diff)
Keywords: IE added
Version: 3.0.23.0

#7956 was marked as duplicate.

comment:8 Changed 4 years ago by giorgio

Cc: giorgio added
Keywords: FF added

The issue occurs also with Firefox using the autogrow plugin.

Last edited 4 years ago by giorgio (previous) (diff)

comment:9 Changed 4 years ago by Jakub Ś

Keywords: FF removed

You need scroll bar in order to use pageUp/pageDown. If you check out autogrow sample you will see that the one with limit of 400px works fine (provided that you enter enough content to see scroll bar).

NOTE: Keyword is Firefox not FF but don't update it as issue reported about Fireofx is invalid.

comment:10 Changed 4 years ago by giorgio

Hello,

basically the main issue that in firefox occurs is that when the autogrow is enabled infinitely, when we press page up/down, the view of the screen doesn't focus where the cursor is, we expect that the browser scroll bar changes in order to focus the view where the cursor is.

So please tell me if this thing can be feasible and doable.

Last edited 4 years ago by giorgio (previous) (diff)

comment:11 Changed 4 years ago by Jakub Ś

Unfortunately there is no way to do it. The best result you can get is with something like below but nothing better. Cursor will be moved either to the beginning or to the end of content. You can always use limited autogrow in order to get "page ups/down" once the scroll bar shows in editor.

var editor = CKEDITOR.replace( 'editor1', {
	extraPlugins: 'autogrow',
	removePlugins: 'resize'
});
editor.on( "pluginsLoaded", function( event ){
	editor.on( 'contentDom', function() {
		var editable = editor.editable();					
		editable.attachListener( editable, 'keyup', function( e ) { 
			if( e.data.getKeystroke() == 33 || e.data.getKeystroke() == 34 ) {
						setTimeout( function() {
							editor.getSelection().scrollIntoView();
						}, 0 );
			}
		}, null, null, 100 );
	});
});

comment:12 Changed 4 years ago by Anna Tomanek

Summary: IE : PageUp & PageDown not working[IE] PageUp and PageDown not working
Note: See TracTickets for help on using tickets.
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy