Luis Andrés Jara Vásquez
Rank: #18437
134Views
11Comments
Solved
Copy to clipboard Mobile only Javascript
Question

Hello, good morning!!!

Someone knows how copy to clipboard in app OS10 and OS11 without plugin?

Bencause i have a solition with a plugin with cordova native code, but my company needs a solution without native code.

The next link is the plugin with native code like reference:

https://www.outsystems.com/forge/component-versions/2964


Regards!
Luis


0
0
on 2020-04-02
Copy link to comment
Nicolas Lagos
Rank: #17827
Solution

Hi Luis,
Try this script, what it does is copy the input value to a textarea created as dummy.

Includes a validation in case it is an IOS device.


var dummy = document.createElement("textarea");

document.body.appendChild(dummy);

dummy.value = $parameters.Text;

if (navigator.userAgent.match(/ipad|ipod|iphone/i)) {

    dummy.contentEditable = true;

    dummy.readOnly = true;

    var range = document.createRange();

    range.selectNodeContents(dummy);

    var selection = window.getSelection();

    selection.removeAllRanges();

    selection.addRange(range);

    el.setSelectionRange(0, 999999);

}

else {

    dummy.select();

}

document.execCommand("copy");

document.body.removeChild(dummy);



See solution in context
2
0
on 2020-04-06
Copy link to comment
Gonçalo Duque
Rank: #2134

Just a note, on the last line of the first if (el.setSelectionRange(0, 999999);) where it reads el, it should be dummy, I believe.


Thanks for your help! 

0
0
13 days ago
Copy link to comment
Eduardo Rodrigues
Champion
Rank: #230

Just create a ClientAction that receives the text you want to copy as input. Pass this entry to a javascript like the one in the image below.

I did it on Web React, I believe it works on mobile.


Good luck!

0
0
on 2020-04-02
Copy link to comment

Eduardo S Sales Rodrigues wrote:

Just create a ClientAction that receives the text you want to copy as input. Pass this entry to a javascript like the one in the image below.

I did it on Web React, I believe it works on mobile.


Good luck!


Thanks Eduardo, but:

your solution only works if you use the link application on the browser phone, but if you generate the application and installed it on your phone, it does not work.

x/


Regards


0
0
on 2020-04-02
Copy link to comment

Luis Andrés Jara Vásquez wrote:

Eduardo S Sales Rodrigues wrote:

Just create a ClientAction that receives the text you want to copy as input. Pass this entry to a javascript like the one in the image below.

I did it on Web React, I believe it works on mobile.


Good luck!


Thanks Eduardo, but:

your solution only works if you use the link application on the browser phone, but if you generate the application and installed it on your phone, it does not work.

x/


Regards


Hi Luis Andrés Jara Vásquez,

You can create a client action and  use the below javascript.

var copyText = document.getElementById($parameters.Text);
  copyText.select();
  document.execCommand("copy");


Regards,

Ellakkiya

0
0
on 2020-04-06
Copy link to comment

Ellakkiya Selvadurai wrote:

Luis Andrés Jara Vásquez wrote:

Eduardo S Sales Rodrigues wrote:

Just create a ClientAction that receives the text you want to copy as input. Pass this entry to a javascript like the one in the image below.

I did it on Web React, I believe it works on mobile.


Good luck!


Thanks Eduardo, but:

your solution only works if you use the link application on the browser phone, but if you generate the application and installed it on your phone, it does not work.

x/


Regards


Hi Luis Andrés Jara Vásquez,

You can create a client action and  use the below javascript.

var copyText = document.getElementById($parameters.Text);
  copyText.select();
  document.execCommand("copy");


Regards,

Ellakkiya

Hello Ellakkiya,


but  it does not work!

Regards


0
0
on 2020-04-06
Copy link to comment
Benjith Sam
mvp_badge
MVP
Rank: #72

Luis Andrés Jara Vásquez wrote:

Ellakkiya Selvadurai wrote:

Luis Andrés Jara Vásquez wrote:

Eduardo S Sales Rodrigues wrote:

Just create a ClientAction that receives the text you want to copy as input. Pass this entry to a javascript like the one in the image below.

I did it on Web React, I believe it works on mobile.


Good luck!


Thanks Eduardo, but:

your solution only works if you use the link application on the browser phone, but if you generate the application and installed it on your phone, it does not work.

x/


Regards


Hi Luis Andrés Jara Vásquez,

You can create a client action and  use the below javascript.

var copyText = document.getElementById($parameters.Text);
  copyText.select();
  document.execCommand("copy");


Regards,

Ellakkiya

Hello Ellakkiya,


but  it does not work!

Regards


Hi Luis,

You have to pass the TextArea/Input Element ID as an input parameter to JS Node. I checked the JS code shared by Ellakkiya Selvadurai and its working as expected on the native android device.


Regards,

Benjith Sam

0
0
on 2020-04-06
Copy link to comment

Benjith Sam wrote:

Luis Andrés Jara Vásquez wrote:

Ellakkiya Selvadurai wrote:

Luis Andrés Jara Vásquez wrote:

Eduardo S Sales Rodrigues wrote:

Just create a ClientAction that receives the text you want to copy as input. Pass this entry to a javascript like the one in the image below.

I did it on Web React, I believe it works on mobile.


Good luck!


Thanks Eduardo, but:

your solution only works if you use the link application on the browser phone, but if you generate the application and installed it on your phone, it does not work.

x/


Regards


Hi Luis Andrés Jara Vásquez,

You can create a client action and  use the below javascript.

var copyText = document.getElementById($parameters.Text);
  copyText.select();
  document.execCommand("copy");


Regards,

Ellakkiya

Hello Ellakkiya,


but  it does not work!

Regards


Hi Luis,

You have to pass the TextArea/Input Element ID as an input parameter to JS Node. I checked the JS code shared by Ellakkiya Selvadurai and its working as expected on the native android device.


Regards,

Benjith Sam

Hello Benjith, 


It works if you get the value of a text box, but if it were a text coming from a webservices or function, it could only be done with a pivot textbox, but testing it like this, it gives error ...


we are close to solving the requirement

regards!


0
0
on 2020-04-06
Copy link to comment
Salman Ansari
Champion
Rank: #39

Hi Luis,

Please check the attached oml. Tested with Android app and its working.

MobileCopyToClipboard.oml

1
0
on 2020-04-06
Copy link to comment

Salman Ansari wrote:

Hi Luis,

Please check the attached oml. Tested with Android app and its working.

Hello Salman, thanks


But i have a question, how do you do for your code works with the imput text (in a var) and not for a textboxs??

Regards


0
0
on 2020-04-06
Copy link to comment
Salman Ansari
Champion
Rank: #39

Luis Andrés Jara Vásquez wrote:

Salman Ansari wrote:

Hi Luis,

Please check the attached oml. Tested with Android app and its working.

Hello Salman, thanks


But i have a question, how do you do for your code works with the imput text (in a var) and not for a textboxs??

Regards


Hi Luis,

I have given the class in Extended property of textbox and pick that class in jquery.




Let me know if you face any issue to integrate in your code

1
0
on 2020-04-06
Copy link to comment
Nicolas Lagos
Rank: #17827
Solution

Hi Luis,
Try this script, what it does is copy the input value to a textarea created as dummy.

Includes a validation in case it is an IOS device.


var dummy = document.createElement("textarea");

document.body.appendChild(dummy);

dummy.value = $parameters.Text;

if (navigator.userAgent.match(/ipad|ipod|iphone/i)) {

    dummy.contentEditable = true;

    dummy.readOnly = true;

    var range = document.createRange();

    range.selectNodeContents(dummy);

    var selection = window.getSelection();

    selection.removeAllRanges();

    selection.addRange(range);

    el.setSelectionRange(0, 999999);

}

else {

    dummy.select();

}

document.execCommand("copy");

document.body.removeChild(dummy);



2
0
on 2020-04-06
Copy link to comment
Gonçalo Duque
Rank: #2134

Just a note, on the last line of the first if (el.setSelectionRange(0, 999999);) where it reads el, it should be dummy, I believe.


Thanks for your help! 

0
0
13 days ago
Copy link to comment