Monday, June 18, 2012

Jquery copy to clipboard

Hi, after long time right? yea... 

anyways after long time i am decided to get back again on blogger :) and make this blogger active and helpful to others.

today i come up with some tricks on javascript or on jquery . its a Copy to clipboard.
In IE we have direct window option to make the copy to clipboard code event , but if you try to do same with Firefox or other it wont work 

so i thought let add some trick to make the copy thing easy :).

Find my below code and put it in the head section


 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.3.2.min.js"> </script>

 
<script type="text/javascript" src="js/jquery.zclip.js"> </script>

    <script type="text/javascript">
        $(document).ready(function() {
            $('a#copy-dynamic').zclip({
                path: 'js/ZeroClipboard.swf',
                copy: function() { return $('input#dynamic').val(); }
            });

        });
   
</script>

and insert this section on your body part.

 <div>
       
<br />
        <a href="#" id="copy-dynamic">Click here to copy the value of this input:</a>
        <input style="width: 300px; margin-left: 15px;" type="text" id="dynamic" value="Insert any text here." onfocus="if(this.value=='Insert any text here.'){this.value=''}" onblur="if(this.value==''){this.value='Insert any text here.'}" />
   
</div>

lets download the swf from GitHubs and put it in your js directory accordingly.

now simple run the application , type the text on the textbox and click on copy button it will copy it in your system just like (Ctrl + C).

Put your comments or suggestion to make this thread active and popular.