Logo
Stockholm-icons / Layout / Layout-4-blocks Created with Sketch.

Clipboard Examples


							<div class="card card-custom">
								<div class="card-header">
									<div class="card-title">
										<h3 class="card-title">
											Clipboard Examples
										</h3>
									</div>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group row">
											<label class="col-form-label text-right col-lg-3 col-sm-12">Basic Demo</label>
											<div class="col-lg-6 col-md-9 col-sm-12">
												<div class="input-group">
													<input type="text" class="form-control" id="kt_clipboard_1" placeholder="Type some value to copy"/>
													<div class="input-group-append">
														<a href="#" class="btn btn-secondary" data-clipboard="true" data-clipboard-target="#kt_clipboard_1"><i class="la la-copy"></i></a>
													</div>
												</div>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-form-label text-right col-lg-3 col-sm-12">Copy From Textarea</label>
											<div class="col-lg-6 col-md-9 col-sm-12">
												<textarea class="form-control" id="kt_clipboard_2" rows="6">Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo. Manduma pindureta quium dia nois paga.</textarea>
												<div class="mt-4"></div>
												<a href="#" class="btn btn-secondary" data-clipboard="true" data-clipboard-target="#kt_clipboard_2"><i class="la la-clipboard"></i> Copy to clipboard</a>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-form-label text-right col-lg-3 col-sm-12">Cut From Textarea</label>
											<div class="col-lg-6 col-md-9 col-sm-12">
												<textarea class="form-control" id="kt_clipboard_3" rows="6">Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo. Manduma pindureta quium dia nois paga.</textarea>
												<div class="mt-4"></div>
												<a href="#" class="btn btn-primary" data-clipboard="true" data-clipboard-action="cut" data-clipboard-target="#kt_clipboard_3"><i class="la la-cut"></i>  Cut to clipboard</a>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-form-label text-right col-lg-3 col-sm-12">Copy From Element</label>
											<div class="col-lg-6 col-md-9 col-sm-12">
												<div id="kt_clipboard_4" style="border: 4px solid #eaeaea; padding: 10px;">Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo. Manduma pindureta quium dia nois paga.</div>
												<div class="mt-4"></div>
												<a href="#" class="btn btn-primary" data-clipboard="true" data-clipboard-target="#kt_clipboard_4"><i class="la la-cut"></i>  Copy to clipboard</a>
											</div>
										</div>
									</div>
									<div class="card-footer">
										<div class="row">
											<div class="col-lg-9 ml-lg-auto">
												<button type="reset" class="btn btn-success mr-2">Submit</button>
												<button type="reset" class="btn btn-secondary">Cancel</button>
											</div>
										</div>
									</div>
								</form>
								<!--end::Form-->
							</div>
						

							"use strict";
							// Class definition

							var KTClipboardDemo = function () {

								// Private functions
								var demos = function () {
									// basic example
									new ClipboardJS('[data-clipboard=true]').on('success', function(e) {
										e.clearSelection();
										alert('Copied!');
									});
								}

								return {
									// public functions
									init: function() {
										demos();
									}
								};
							}();

							jQuery(document).ready(function() {
								KTClipboardDemo.init();
							});

						
Copy to clipboard
Cut to clipboard
Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo. Manduma pindureta quium dia nois paga.
Copy to clipboard

User Profile 12 messages

Recent Notifications
Stockholm-icons / Home / Library Created with Sketch.
Another purpose persuade Due in 2 Days
+28%
Stockholm-icons / Communication / Write Created with Sketch.
Would be to people Due in 2 Days
+50%
Stockholm-icons / Communication / Group-chat Created with Sketch. -27%
Stockholm-icons / General / Attachment2 Created with Sketch.
The best product Due in 2 Days
+8%
System Messages
Top Authors Most Successful Fellas
+82$
Popular Authors Most Successful Fellas
+280$
New Users Most Successful Fellas
+4500$
Active Customers Most Successful Fellas
+4500$
Bestseller Theme Most Successful Fellas
+4500$
Notifications
Stockholm-icons / Home / Library Created with Sketch.
Another purpose persuade Due in 2 Days
+28%
Stockholm-icons / Communication / Write Created with Sketch.
Would be to people Due in 2 Days
+50%
Stockholm-icons / Communication / Group-chat Created with Sketch. -27%
Stockholm-icons / General / Attachment2 Created with Sketch.
The best product Due in 2 Days
+8%
Customer Care
Reports
Memebers
Stockholm-icons / Navigation / Up-2 Created with Sketch.

Select A Demo