Questions tagged [clipboard.js]

Clipboard.js is a modern approach to copy text to clipboard. It doesn't depend on Flash. It has no dependencies. And it's just 2kb gzipped.

Copying text to the clipboard shouldn't be hard. It shouldn't require dozens of steps to configure or hundreds of KBs to load. But most of all, it shouldn't depend on Flash or any bloated framework. That's why clipboard.js exists.

137 questions

votes

2 answers

How to make ClipboardJS copy text along with its hyperlink?

how to make ClipboardJS can copy text along with it's hyperlink? I already tried using data-link but no luck, clipboard.on('success', function(e) { var aff_link = $(this).attr('data-link'); }); this is what I already tried to make, and the…

jquery html clipboard.js

asked Aug 19 '19 at 04:32

Khrisna Gunanasurya

votes

2 answers

vuejs2 copy clipboard issue

I am trying to use https://alligator.io/vuejs/vue-clipboard-copy/ for copy clip board feature in Vue.js, it is working fine for string but when I have an object, it is not copying properly. Below is the sample code.

javascript vue.js vuejs2 clipboard.js

asked Apr 09 '19 at 08:47

Madasu K

1,813
2
38
72

votes

1 answer

Using clipboard.js with Yii2

I have installed the extension \supplyhog\ClipboardJs\ClipboardJsWidget which seemingly working fine. but I am struggling to make it work in gridview. as the code for the extension is already using a widget and gridview itself being a widget, so I…

javascript php yii2 clipboard.js

asked Nov 25 '18 at 18:17

Joshi

2,730
5
36
62

votes

0 answers

Clipboard.js Copy multiple elements with One Button Click

This is a new question but relates to this question. In short I am now able to copy a cell in a generated table to the clipboard. What I would like to do now is add more text to the clipboard using the same button. I have tried using the imperative…

jquery html clipboard.js

asked Jan 08 '18 at 17:11

Prof. Falken

votes

4 answers

How to copy input's value with clipboard.js

I don't know how to copy the value to clipboard from the input without using ID! Here is JS: new Clipboard(".form__copy-btn", { target: function (trigger) { return $(trigger).closest(".form__field-wrapper").find("input"); } …

javascript jquery html css clipboard.js

asked Aug 01 '17 at 06:28

user7455781

votes

2 answers

How to use SweetAlert with clipboard.js library?

I'm trying to use SweetAlert with the clipboard.js library. I have tried simulating a click on a HTML button when the user confirm on SweetAlert, but it didn't work. Here is what I've tried to do: My HTML:

votes

2 answers

Individual tooltip when using multiple buttons with clipboard.js

I have a page with two textareas and two buttons that copy the content of each textarea respectively to the user's clipboard when pressed. When the button is pressed and the copying is successful, a tooltip shows saying Copied!. With how I had it…

javascript jquery clipboard.js

asked Jun 15 '16 at 17:40

user5368737

votes

2 answers

Copy URL from browser using clipboard.js

I am using the Accusoft document viewer. I have a requirement for a button that when clicked will copy to the clipboard the current URL plus a page number querystring parameter. I am using clipboard.js. I know exactly how to get the current URL and…

javascript clipboard.js

asked May 25 '16 at 16:18

Michael Mahony

1,310
3
15
33

votes

1 answer

How can I wait for an ajax call to complete without using 'async: false' and without using callbacks?

I have the following TypeScript defining a KnockoutJS binding handler for a clickable element on my view: module MyModule { export interface ICopyButtonParams { dataUrl: string; } ko.bindingHandlers.copyButton = { init:…

ajax asynchronous knockout.js typescript clipboard.js

asked May 17 '16 at 12:34

aleonj

votes

2 answers

Trigger clipboard.js parent

I am using the Clipboard.js plugin a website, and stuck with the issue selecting only parent class of the .copy button on-click. The problem is that I want the code inside pre tag to be copied with rich text formatting and the method I am using…

javascript jquery html css clipboard.js

asked Jan 30 '16 at 13:35

egurb

1,176
2
14
40

votes

2 answers

Copy to Clipboard is Not Working in safari

Below is my code to "copy to clipboard" everything is workingfine with except its not working on safari browser... please help

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-33127663">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>2</strong></span>
                    <div class="viewcount">votes</div>
                </div>
            </div>

<div class="status answered-accepted">
                <strong>3</strong> answers
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/33127663/pattern-for-javascript-instantiation-which-doesn-t-upset-eslint" class="question-hyperlink">Pattern for javascript instantiation which doesn't upset eslint</a></h3>
        <div class="excerpt">I've seen plenty of libraries which use the following pattern - e.g. clipboard.js which I've just been working with:
var clipboard = new Clipboard(".cpy");

That's all it needs to do its magic. But that annoys ESLint:
clipboard is defined but never…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/javascript" class="post-tag grid--cell" title="show questions tagged 'javascript'" rel="tag">javascript</a> 
                
                <a href="../../questions/tagged/design-patterns" class="post-tag grid--cell" title="show questions tagged 'design-patterns'" rel="tag">design-patterns</a> 
                
                <a href="../../questions/tagged/eslint" class="post-tag grid--cell" title="show questions tagged 'eslint'" rel="tag">eslint</a> 
                
                <a href="../../questions/tagged/clipboard.js" class="post-tag grid--cell" title="show questions tagged 'clipboard.js'" rel="tag">clipboard.js</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Oct 14 '15 at 14:09">asked Oct 14 '15 at 14:09</time>
    <a href="../../users/1454454/dsl101" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/1454454.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="dsl101" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/1454454/dsl101" class="s-user-card--link">dsl101</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">1,715</li>
            
            <li class="s-award-bling s-award-bling__silver" title="16 silver badges">16</li>
            <li class="s-award-bling s-award-bling__bronze" title="36 bronze badges">36</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-75472912">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>1</strong></span>
                    <div class="viewcount">vote</div>
                </div>
            </div>

<div class="status ">
                <strong>1</strong> answer
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/75472912/how-do-i-read-the-clipboard-with-blazor" class="question-hyperlink">How do I read the clipboard with blazor?</a></h3>
        <div class="excerpt">I am using a Blazor Server application that have a screencasting feature. My goal is to get the data from clipboard and I am talking about not only a text which is easy but overall some img, files, texts etc.
I have a service named ClipboardService…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/c#" class="post-tag grid--cell" title="show questions tagged 'c#'" rel="tag">c#</a> 
                
                <a href="../../questions/tagged/blazor" class="post-tag grid--cell" title="show questions tagged 'blazor'" rel="tag">blazor</a> 
                
                <a href="../../questions/tagged/clipboard" class="post-tag grid--cell" title="show questions tagged 'clipboard'" rel="tag">clipboard</a> 
                
                <a href="../../questions/tagged/clipboard.js" class="post-tag grid--cell" title="show questions tagged 'clipboard.js'" rel="tag">clipboard.js</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Feb 16 '23 at 13:22">asked Feb 16 '23 at 13:22</time>
    <a href="../../users/20776070/george-korolev" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/20776070.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="George Korolev" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/20776070/george-korolev" class="s-user-card--link">George Korolev</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">31</li>
            
            
            <li class="s-award-bling s-award-bling__bronze" title="3 bronze badges">3</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-71880967">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>1</strong></span>
                    <div class="viewcount">vote</div>
                </div>
            </div>

<div class="status ">
                <strong>2</strong> answers
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/71880967/how-to-set-settimeout-function-in-copy-button" class="question-hyperlink">How to set setTimeout function in copy button?</a></h3>
        <div class="excerpt">i want to set setTimeout function in copy button so that if user click copy then text will be "copied" after that it will return to "copy" after 3-4sec. please Help me to solve this prblm and also help me to make it more light weight js.
Below is my…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/javascript" class="post-tag grid--cell" title="show questions tagged 'javascript'" rel="tag">javascript</a> 
                
                <a href="../../questions/tagged/jquery" class="post-tag grid--cell" title="show questions tagged 'jquery'" rel="tag">jquery</a> 
                
                <a href="../../questions/tagged/clipboard.js" class="post-tag grid--cell" title="show questions tagged 'clipboard.js'" rel="tag">clipboard.js</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Apr 15 '22 at 06:53">asked Apr 15 '22 at 06:53</time>
    <a href="../../users/16145950/nikkcrew07" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/16145950.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="nikkcrew07" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/16145950/nikkcrew07" class="s-user-card--link">nikkcrew07</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">5</li>
            
            
            <li class="s-award-bling s-award-bling__bronze" title="4 bronze badges">4</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-69779904">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>1</strong></span>
                    <div class="viewcount">vote</div>
                </div>
            </div>

<div class="status ">
                <strong>1</strong> answer
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/69779904/problem-using-readclipboard-in-shiny-app-deployed-to-shinyapps-io" class="question-hyperlink">Problem using readClipboard() in Shiny app deployed to shinyapps.io</a></h3>
        <div class="excerpt">I have created a Shiny App that relies on reading data directly from the user's clipboard. This Shiny app works perfectly when running on my local machine; however when I deploy the app to shinyapps.io I get the following error:
Warning: Error in…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/r" class="post-tag grid--cell" title="show questions tagged 'r'" rel="tag">r</a> 
                
                <a href="../../questions/tagged/shiny" class="post-tag grid--cell" title="show questions tagged 'shiny'" rel="tag">shiny</a> 
                
                <a href="../../questions/tagged/clipboard" class="post-tag grid--cell" title="show questions tagged 'clipboard'" rel="tag">clipboard</a> 
                
                <a href="../../questions/tagged/shinyapps" class="post-tag grid--cell" title="show questions tagged 'shinyapps'" rel="tag">shinyapps</a> 
                
                <a href="../../questions/tagged/clipboard.js" class="post-tag grid--cell" title="show questions tagged 'clipboard.js'" rel="tag">clipboard.js</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Oct 30 '21 at 13:07">asked Oct 30 '21 at 13:07</time>
    <a href="../../users/3388244/tjc" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/3388244.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="TJC" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/3388244/tjc" class="s-user-card--link">TJC</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">41</li>
            
            
            <li class="s-award-bling s-award-bling__bronze" title="4 bronze badges">4</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>

</div>
        </div>

</div>
        </div>
        <script src="../../static/js/stack-icons.js"></script>
        <script src="../../static/js/fromnow.js"></script>
        
    </body>
</html>