I need to copy the content of a <code></code> section using ClipboardJS. When following the tutorial, I end up with this error :

Uncaught Error: Invalid "target" value, use a valid Element

Any workaround on this ?

EDIT:

HTML

<code id="#foo">my fantastic code</code>
    <button class="copy-button" data-clipboard-action="copy" data-clipboard-target="#foo">
      Copy !
</button>

JAVASCRIPT

<script type="text/javascript">
  var clipboard = new Clipboard('.copy-button');

  clipboard.on('success', function(e) {
      console.info('Action:', e.action);
      console.info('Text:', e.text);
      console.info('Trigger:', e.trigger);

      e.clearSelection();
  });

  clipboard.on('error', function(e) {
      console.error('Action:', e.action);
      console.error('Trigger:', e.trigger);
  });
</script>

I need to copy the content of a <code></code> section using ClipboardJS. When following the tutorial, I end up with this error :

Uncaught Error: Invalid "target" value, use a valid Element

Any workaround on this ?

EDIT:

HTML

<code id="#foo">my fantastic code</code>
    <button class="copy-button" data-clipboard-action="copy" data-clipboard-target="#foo">
      Copy !
</button>

JAVASCRIPT

<script type="text/javascript">
  var clipboard = new Clipboard('.copy-button');

  clipboard.on('success', function(e) {
      console.info('Action:', e.action);
      console.info('Text:', e.text);
      console.info('Trigger:', e.trigger);

      e.clearSelection();
  });

  clipboard.on('error', function(e) {
      console.error('Action:', e.action);
      console.error('Trigger:', e.trigger);
  });
</script>

• javascript
• clipboard.js

• Where is your actual code? It looks like you aren't selecting the element correctly. You can see here that it works fine on code elements. – Mike Cluck Commented Feb 23, 2017 at 17:53
• @MikeC Thank you for your input. I edited with my code – user4187476 Commented Feb 23, 2017 at 18:00
• 3 You have a typo. It should be <code id="foo">..., not <code id="#foo">... – Mike Cluck Commented Feb 23, 2017 at 18:01

1 Answer 1

Try to change this line:

<code id="#foo">my fantastic code</code>

for

<code id="foo">my fantastic code</code>