Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
-
- New User
- Posts: 9
- Joined: Fri Jul 10, 2015 10:43 am
- First Name: David
- Last Name: Scorca
- Company Name: Banyan Air Services
- State / Province: Florida
- Country: United States
- Contact:
Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
I have a large html container which has an onclick event used to bring up an entry window. Our users want to select text with their mouse (which starts with a click) so they can select part of the text to copy and paste elsewhere.
I don't really want to change my action to a ondblclick event. Is it possible to somehow delay the onclick if they start dragging and selecting text? Are their any other suggestions on how to do it?
Thank you all in advance.
I don't really want to change my action to a ondblclick event. Is it possible to somehow delay the onclick if they start dragging and selecting text? Are their any other suggestions on how to do it?
Thank you all in advance.
-
- Experienced User
- Posts: 2711
- Joined: Wed Aug 01, 2012 8:58 am
- First Name: Scott
- Last Name: Klement
- Company Name: Profound Logic
- City: Milwaukee
- State / Province: Wisconsin
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
Off the top of my head... instead of 'onclick' maybe use 'onmousedown' and 'onmouseup'?
onmousedown occurs when they push down on the mouse button, and onmouseup occurs when they release it. So the idea is to check the position of the mouse when they push down and when they release... if the mouse up position is very close to the mouse down position, then bring up your entry window.
But if the mouse position has moved (more than a few pixels) before the mouse button was released, then someone was probably selecting text, so in that case, don't bring up the entry window.
Just a thought, I haven't tried it (and don't have time right now)
onmousedown occurs when they push down on the mouse button, and onmouseup occurs when they release it. So the idea is to check the position of the mouse when they push down and when they release... if the mouse up position is very close to the mouse down position, then bring up your entry window.
But if the mouse position has moved (more than a few pixels) before the mouse button was released, then someone was probably selecting text, so in that case, don't bring up the entry window.
Just a thought, I haven't tried it (and don't have time right now)
-
- New User
- Posts: 9
- Joined: Fri Jul 10, 2015 10:43 am
- First Name: David
- Last Name: Scorca
- Company Name: Banyan Air Services
- State / Province: Florida
- Country: United States
- Contact:
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
Thank you Scott. That gives me something new to try although I'm not sure how to retrieve the pixel location of the cursor when the onmouseup/down events occur. Would the script be something like the following on each event (with different variables of course).
var x1 = event.clientX;
var y1 = event.clientY;
Sorry, I'm not too slick with JS yet.
var x1 = event.clientX;
var y1 = event.clientY;
Sorry, I'm not too slick with JS yet.
-
- Experienced User
- Posts: 2711
- Joined: Wed Aug 01, 2012 8:58 am
- First Name: Scott
- Last Name: Klement
- Company Name: Profound Logic
- City: Milwaukee
- State / Province: Wisconsin
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
Well, yeah, that was my idea... you'd just code something like this:
MOUSE DOWN EVENT:
MOUSE UP EVENT:
So basically, the 'onmousedown' saves the X/Y position of the client, and 'onmouseup' compares it against them.. if the mouse has moved (in this example, by 10 pixels) then it doesn't count it as a click....
I don't know how your code to open the window works, so, I just stuck a "pui,click" in there... you'll have to adjust that code to be what you want.
MOUSE DOWN EVENT:
Code: Select all
(function (e) {
e = e || window.event; // for compat with old Internet Explorer
if (typeof window.banyan == "undefined") {
window.banyan = {};
}
banyan.mouseDownX = e.clientX;
banyan.mouseDownY = e.clientY;
})
Code: Select all
(function (e) {
e = e || window.event; // for compat with old Internet Explorer
if (typeof window.banyan != "undefined") {
banyan.mouseUpX = e.clientX;
banyan.mouseUpY = e.clientY;
var xdiff = Math.abs(banyan.mouseUpX - banyan.mouseDownX);
var ydiff = Math.abs(banyan.mouseUpY - banyan.mouseDownY);
if (xdiff<10 && ydiff<10) {
pui.click("showWindow"); // click the hidden "show window" button
// because mouse hasn't moved much.
}
}
})
I don't know how your code to open the window works, so, I just stuck a "pui,click" in there... you'll have to adjust that code to be what you want.
-
- Experienced User
- Posts: 2711
- Joined: Wed Aug 01, 2012 8:58 am
- First Name: Scott
- Last Name: Klement
- Company Name: Profound Logic
- City: Milwaukee
- State / Province: Wisconsin
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
I must admit, I'm not sure if the way I posted is good or not... it's just off the top of my head.
-
- New User
- Posts: 9
- Joined: Fri Jul 10, 2015 10:43 am
- First Name: David
- Last Name: Scorca
- Company Name: Banyan Air Services
- State / Province: Florida
- Country: United States
- Contact:
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
Thank you so much Scott. I can take what you posted and run with it to see how to works out. Any help is, as always, greatly appreciated.
-
- New User
- Posts: 9
- Joined: Fri Jul 10, 2015 10:43 am
- First Name: David
- Last Name: Scorca
- Company Name: Banyan Air Services
- State / Province: Florida
- Country: United States
- Contact:
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
FYI Scott...
The example you gave works perfectly.
The example you gave works perfectly.
-
- New User
- Posts: 14
- Joined: Fri Dec 05, 2014 1:17 pm
- First Name: Nick
- Last Name: Deppe
- Company Name: Victaulic
- Phone: 6109233257
- Address 1: 4901 Kesslersville Road
- City: Easton
- State / Province: Pennsylvania
- Zip / Postal Code: 18040
- Country: United States
- Contact:
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
I am having a similar issue, except in my case it is with a grid that allows for row selection. It looks like the row selection is preventing users from selecting text on the grid. Does anyone know of a workaround for this?
-
- Experienced User
- Posts: 2711
- Joined: Wed Aug 01, 2012 8:58 am
- First Name: Scott
- Last Name: Klement
- Company Name: Profound Logic
- City: Milwaukee
- State / Province: Wisconsin
Re: Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element
Sorry, I don't know of a workaround for the conflict between row selection and selecting text with a mouse. Row selection shjould work with moving the mouse, etc, so you can use that method to select lots of rows. So, it really needs the ability to take over the mouse.
The only way around this that I can think of is to use a different method of selecting rows. For example, add a checkbox to each row of the grid, and let the user select rows by checking the checkbox instead of using row selection.
The only way around this that I can think of is to use a different method of selecting rows. For example, add a checkbox to each row of the grid, and let the user select rows by checking the checkbox instead of using row selection.
Who is online
Users browsing this forum: No registered users and 1 guest