This Blog describes, how we can copy to clipboard using JavaScript. Copying content from a web form without needing to use the default browser functions. For this i am using ZeroClipboard functionality in the JavaScript.
1. Create a new web application.
2. Include ZeroClipboard.js file in to your web application location or you can use online link mentioned below
<script src="http://zeroclipboard.org/javascripts/zc/v2.1.6/ZeroClipboard.js"></script>
3.Here is the following code you have to add in script, HTML, and can add styles(CSS) for it.
<div class="email-modal"> <div > <div role="document"> <h4>Text To Copy:</h4> <div class="modal-body"> <textarea class="text_copy" rows="5" cols="100" >text to Copy</textarea> </div> <br> <div> <button id='clip_board' data-clipboard-text="" class="copy-button">Copy to ClipBoard</button> </div> </div> </div> </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="http://zeroclipboard.org/javascripts/zc/v2.1.6/ZeroClipboard.js"></script> <script type="text/javascript"> $('#clip_board').attr('data-clipboard-text', $(".text_copy").text()) window.onload = function(){ var client = new ZeroClipboard(document.getElementsByClassName("copy-button") ); client.on( "ready", function( readyEvent ) { client.on( "aftercopy", function( event ) { alert("Copied.." ); }); }); } </script>
Here "copy-button" is "button class" mentioned in the html whis reads your html markup content.
Micropyramid is a software development and cloud consulting partner for enterprise businesses across the world. We work on python, Django, Salesforce, Angular, Reactjs, React Native, MySQL, PostgreSQL, Docker, Linux, Ansible, git, amazon web services. We are Amazon and salesforce consulting partner with 5 years of cloud architect experience. We develop e-commerce, retail, banking, machine learning, CMS, CRM web and mobile applications.
Django-CRM :Customer relationship management based on Django
Django-blog-it : django blog with complete customization and ready to use with one click installer Edit
Django-webpacker : A django compressor tool
Django-MFA : Multi Factor Authentication
Docker-box : Web Interface to manage full blown docker containers and images
More...