Allow mouse to select text (for ctrl-c copy) on a 'onclick' html element

Use this board to ask questions or have discussions with other Rich Displays users.
Post Reply
dscorca
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

Post by dscorca »

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.
Scott Klement
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

Post by Scott Klement »

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)
dscorca
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

Post by dscorca »

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.
Scott Klement
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

Post by Scott Klement »

Well, yeah, that was my idea... you'd just code something like this:

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;
})
MOUSE UP EVENT:

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.
     }
   }
})
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.
Scott Klement
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

Post by Scott Klement »

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.
dscorca
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

Post by dscorca »

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.
dscorca
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

Post by dscorca »

FYI Scott...

The example you gave works perfectly.
ndeppe
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

Post by ndeppe »

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?
Scott Klement
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

Post by Scott Klement »

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.
Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest