Backing out selection upon mouse click

[Csaba Gabor]

Sometimes you want to check a (continguous) range of
checkboxes. I've implemented this in Greasemonkey and
Gmail does it too: When you press the shift key while clicking
a checkbox, all checkboxes between the last clicked checkbox
and the current one take on the state of the newly toggled
checkbox.

Now I have a situation where I've got rows in a table, but no
checkboxes. No problem, same basic code. However, there
is an issue. When I hold down the shift key, all the text
between the prior location and the place where I've clicked
gets selected. This is very irritating. I thought I could get
rid of this effect by doing something like:

var shiftP = evt.modifiers ?
evt.modifiers & Event.SHIFT_MASK :
(evt.shiftKey || false);
if (shiftP) {
if (evt.preventDefault) evt.preventDefault();
evt.cancelBubble = true;
evt.returnValue = false; }

but this gives me no joy. I can, of course, explicitly
collapse the selection, but isn't there a more standard way
that I'm missing?

Thanks,
Csaba Gabor from Vienna

 

[Evertjan.]

Csaba Gabor wrote on 17 apr 2010 in comp.lang.javascript:

Sometimes you want to check a (continguous) range of
checkboxes. I've implemented this in Greasemonkey and
Gmail does it too: When you press the shift key while clicking
a checkbox, all checkboxes between the last clicked checkbox
and the current one take on the state of the newly toggled
checkbox.

Now I have a situation where I've got rows in a table, but no
checkboxes. No problem, same basic code. However, there
is an issue. When I hold down the shift key, all the text
between the prior location and the place where I've clicked
gets selected. This is very irritating. I thought I could get
rid of this effect by doing something like:

var shiftP = evt.modifiers ?
evt.modifiers & Event.SHIFT_MASK :
(evt.shiftKey || false);

This is strange:
if evt.shiftKey evaluates to true the ||false is not used.
if evt.shiftKey evaluates to false the ||false is not needed.

if (shiftP) {
if (evt.preventDefault) evt.preventDefault();
evt.cancelBubble = true;
evt.returnValue = false; }

but this gives me no joy. I can, of course, explicitly
collapse the selection, but isn't there a more standard way
that I'm missing?

Pseudo code for a range of checkboxes:

if (shift-select-event && only-one-other-selected) {
select-all-inbetween-inclusive;
blur-all;
focus-latest-selected;
} else {
do-normal-nonshift-select; // or do-nothing;
};

 

[Csaba Gabor]

Csaba Gabor wrote on 17 apr 2010 in comp.lang.javascript:




This is strange:
if evt.shiftKey evaluates to true the ||false is not used.
if evt.shiftKey evaluates to false the ||false is not needed.

Not so strange. If evt.shiftKey is undefined, null, 0, etc.
then the code above ensures a boolean false. Perhaps not
relevant here, but in some situations it can bite you.

Pseudo code for a range of checkboxes:

if (shift-select-event && only-one-other-selected) {
select-all-inbetween-inclusive;
blur-all;
focus-latest-selected;} else {

do-normal-nonshift-select; // or do-nothing; };

OK, I see that I have been unclear, so let me clarify.
In the current situation I have rows in a table. When I
click on any row (without the shift), it toggles the
background color (row.bgColor) for that row. Simple, but
effective. Note that a simple click implies no text selection
(as opposed to row selection). Actually, it implies a
collapsed text selection (ie. the selection point has moved).

Now, when I do a shift click, I determine the previous
row that got clicked (with or without shift), and the
current row. I then determine what color, c, toggling
the current row will give, and then for each row
between the old row and the present one, I set its
color to c.

Unfortunately, text is also getting selected with the
shift click of a row, and it is this text selection
which I wished to prevent. Here is a method that
works, but it just strikes me that the same should
be achievable by cancelling the default action of the
click.

var priorRowIdx = row.parentNode.parentNode.priorRow;
var sel, curRowIdx = currentRow.rowIndex;
row.parentNode.parentNode.priorRow = curRowIdx;

if (shiftP) {
// This branch is for FF and friends
if (window.getSelection) (sel=window.getSelection())
.collapse(sel.focusNode, sel.focusOffset);
// This branch is for IE and company
else if (document.selection &&
(sel=document.selection.createRange())) {
// document.selection.empty() is not good here
// because it always collapses the selection
// to the start and not to the caret (current
// mouse location)
sel.collapse(priorRowIdx>curRowIdx);
sel.select(); } }

Csaba Gabor

 

[Evertjan.]

Csaba Gabor wrote on 17 apr 2010 in comp.lang.javascript:

Not so strange. If evt.shiftKey is undefined, null, 0, etc.
then the code above ensures a boolean false. Perhaps not
relevant here, but in some situations it can bite you.

Strange indeed,
because the evt.shiftKey itself will ANWAYS be converted to a boolean,
so in a if () context as shown, it is just as stange as:

if (aVar == true)

in stead of

if (aVar)

[........]

Unfortunately, text is also getting selected with the
shift click of a row, and it is this text selection
which I wished to prevent.

There is no need to prevent it,
when you can immediately blur() it in your function,
me seems.

The selection would be so momentaneous,
it won't even, I hope, be noticable.

 

[Thomas 'PointedEars' Lahn]

Now I have a situation where I've got rows in a table, but no
checkboxes. No problem, same basic code. However, there
is an issue. When I hold down the shift key, all the text
between the prior location and the place where I've clicked
gets selected. This is very irritating. I thought I could get
rid of this effect by doing something like:

var shiftP = evt.modifiers ?
evt.modifiers & Event.SHIFT_MASK :
(evt.shiftKey || false);
if (shiftP) {
if (evt.preventDefault) evt.preventDefault();
evt.cancelBubble = true;
evt.returnValue = false; }

but this gives me no joy. I can, of course, explicitly
collapse the selection, but isn't there a more standard way
that I'm missing?

I guess (because you have not provided enough context) that you are trying
to prevent the default action of the `click' event.

You need to prevent the default action of the `mousedown' event instead.
WFM in Iceweasel 3.6.3.

<http://jibbering.com/faq/#posting> pp.


PointedEars