0

For coping to the clipboard I'm using Zero Clipboard, recommended by this answer.

The code works perfectly fine when used in this form.

<div id="d_clip_button" style="background: #FFFFCC;">
    Click to copy
</div>
<script language="JavaScript" type="text/javascript">
        var clip = new ZeroClipboard.Client();
                        clip.setText( '<?php echo "http://example.com/" . $var; ?>' );
                        clip.glue( 'd_clip_button' );
</script>

A problem occurs when this above code is called dynamically like this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>

<form action="generar.php" method="post">
Input: <input type="text" id="longUrl" name="longUrl" value="" /><br />
<input type="button" value="Acortar!" onclick="submitme()" />
<div id="resultado"></div>
</form>



<script type="text/javascript" charset="utf-8">

    function submitme(){
    var tosend=document.getElementById("longUrl").value;
    $.ajax({
            type: 'POST',
            url: 'generar.php',
            data: 'longUrl='+tosend,
            success: function(msg){
                if(msg){
                    document.getElementById("resultado").innerHTML=msg;
                }
                else{
                    return;
                }
            }
        });
    }

</script>

The "Click to copy" appears but the resource is not called correctly since it's "not flash".

Any ideas on how to make this work / what is the problem?

Thanks in advance!! Please ask for any clarification needed!


Could it have (don't think so) anything to do with the whole thing being nested on a div?

Community
  • 1
  • 1
Trufa
  • 39,971
  • 43
  • 126
  • 190
  • how are you going to use zeroclipboard in the second example? – www0z0k Jan 30 '11 at 11:37
  • @www0z0k sorry for the delay, exactly the same way it is posted. Since the code is in generar.php but it is called and displayed by the AJAX function. See [demo](http://muycorto.com) – Trufa Jan 30 '11 at 15:12
  • where should i click to copy? – www0z0k Jan 30 '11 at 16:20
  • @www0z0k hehe sorry! where ti says "Clic para copiar." – Trufa Jan 30 '11 at 16:43
  • @www0z0k actually if you press enter (on the text box) and don't press the button it works just fine! – Trufa Jan 30 '11 at 16:47
  • i clicked there and clipboard was empty. win7, firefox, debug flashplayer 10.1.85.3 – www0z0k Jan 30 '11 at 17:16
  • @www0z0k tis is after pressing enter not the button right? in the /generar.php itself?? – Trufa Jan 30 '11 at 17:22
  • after pressing enter the form disappears and everything works ok. if i click the button the form remains and swf is not displayed – www0z0k Jan 30 '11 at 17:26
  • @www0z0k well that is exactly my problem ;) and it is strange since it should be the same content. – Trufa Jan 30 '11 at 17:32
  • both versions have `` ? – www0z0k Jan 30 '11 at 17:35
  • No, none of them, but is it needed in the docs (http://code.google.com/p/zeroclipboard/wiki/Instructions#onLoad) it says >>The onLoad event is fired when the Flash movie completes loading and is ready for action. Please note that you don't need to listen for this event to set options -- those are automatically passed to the movie if you call them before it loads. – Trufa Jan 30 '11 at 17:39
  • i didn't manage to make it work without it – www0z0k Jan 30 '11 at 17:53
  • could you provide html+js as it's returned by the server? – www0z0k Jan 30 '11 at 17:54
  • yes. this is the main page: http://pastie.org/1512290 this is when you press enter: http://pastie.org/1512287 (works) and this is what the DOM inspector (developer tools show) in chrome shows (since it the content is dynamically loaded ans is't not directly show in the source) http://pastie.org/1512307. Could it have something to do with the fact that it's nested inside the `
    `??
    – Trufa Jan 30 '11 at 18:07
  • @www0z0k I'm sorry, I answer your question but forgot to mention you. You probably did not get it. – Trufa Jan 30 '11 at 19:17
  • @ Trufa - i made a demo (based on your code #2) where your button inside the form was `clip` and it worked fine – www0z0k Jan 31 '11 at 00:54
  • @www0z0k thanks for that! I'm really confused. I think it might be that it is not in the actual source code but I have to inspect it with the developers tools, It seems to no being able to pick up the javascript or the flash because of that (I don't know how to express this more technically) – Trufa Jan 31 '11 at 01:16
  • @ Trufa - pasted http://pastie.org/pastes/1512307/text into an empty html file in the zeroclipboard folder and it worked. also there's an error on your demo page: `
    ` can't be found by `getElementById` when the button is clicked. if the problem will remain after fixing the id imho `clip` should be created earlier
    – www0z0k Jan 31 '11 at 01:20
  • @www0z0k what `getElementById` do you mean? (Maybe it was just one of my tests that screwed it up) – Trufa Jan 31 '11 at 01:29
  • @ Trufa - the problem is that after the button is clicked `ZeroClipboard.swf` is not loaded – www0z0k Jan 31 '11 at 01:43
  • @ Trufa - just used the firebug network tab) – www0z0k Jan 31 '11 at 01:44
  • @www0z0k that is so strange! It should be EXACTLY the same content, why would one trigger something and the other one not! – Trufa Jan 31 '11 at 01:45
  • @ Trufa - let's discuss it in a more realtime mode: http://chat.stackoverflow.com/rooms/509/zero-clipboard – www0z0k Jan 31 '11 at 01:55

1 Answers1

2

innerHTML doesn't execute JavaScript that gets passed through in the Ajax call.

Use jQuery's .html().

 $("#resultado").html(msg);
Pekka
  • 442,112
  • 142
  • 972
  • 1,088
  • http://chat.stackoverflow.com/transcript/17 here are some chat transcripts. Thanks @Pekka – Trufa Jan 31 '11 at 02:21