In this guide, I will show you how to send a simple VET transaction using an HTML form and Connex.
Connex is the standard interface to connect Vechain apps with Vechain blockchain and user. Connex
is a set of well-designed APIs for developers, with injected Connex Object
in web applications they can easily build decentralized applications.
We will start by creating a basic HTML form that allows the user the enter a certain amount of VET to send to an address.
<div class="form-group">
<label class="form-label">Amount of VET:</label>
<div class="form-input">
<input type="text" class="form-inputfield" id="amount" value="10000">
<button onclick="transaction('0xBea98D7796261c997a402A251b13E524330A8323');">Submit</button>
<div id="error" class="error"></div>
</div>
</div>
Now we add the Javascript to your website which will be executed once we click the Submit button:
<script>
function transaction(address) {
//warn the user if no Connex is found
if (!window.connex) {
document.getElementById("error").innerHTML = "Sorry, you need to open this page using Sync or the Vechain mobile wallet." return
}
//check to make sure the entered amount is an integer
if (!Number.isInteger(amount) == false) {
document.getElementById("error").innerHTML = "Sorry please enter a round amount of VET." return
}
//convert VET amount to the required format
amount = document.getElementById("amount").value;
vetamount = "0x" + (amount * 1e18).toString(16);
//create a comment to be displayed to the user when he signs the transaction.
comment = "send " + amount + " VET";
//setup the signing service
const signingService = connex.vendor.sign('tx')
//request a new transaction
signingService.request([
{
to: address,
value: vetamount,
data: '0x',
comment: comment
}
]).then(result => {console.log(result)})
}
</script>
And you are done!
Visit your HTML page from any Connex powered browser (Sync or the VechainThor mobile wallet) and it should work.
Find out more settings you can use at the Connex API