var clipboard = new Clipboard('#AmountTo'); clipboard.on('success', function (e) { $("#messageBox").text("Amount Successfully Copied!").show().fadeOut(2000); e.clearSelection(); }); clipboard.on('error', function (e) { $("#messageBox").text("Error Copying Amount").show().fadeOut(2000); }); $('#AmountFrom').click(function () { $("#AmountFrom").val(""); }); $("#AmountFrom").keyup(function () { var amountFrom = $('#AmountFrom').val(); var rate = 1.80; var convertedAmount = amountFrom * rate; $('#AmountTo').val(convertedAmount.toFixed(2)); });
<div class="row"> <div class="col-md-6"> From <div class="input-group"> <div class="input-group-addon">$</div> <input id="AmountFrom" class = "form-control input-largest" step = "0.01" type = "number" /> </div> </div> <div class="col-md-6"> To <div class="input-group"> <div class="input-group-addon">$</div> <input type="text" id="AmountTo" class="form-control input-largest" readonly data-clipboard-action="copy" data-clipboard-target="#AmountTo" /> </div> </div> </div> <div class="row"> <div class="col-md-6"><br /> </div> <div class="col-md-6"><br /><span id="messageBox" class="text-success" style="display: block; text-align: center"></span></div> </div>