Web app to call a payable function with parameter

Question

Let suppose we have a contract with a payable function like this:

function join(address sender) payable {};

So I have an user to join, invited by a presenter which address is address. I want to create a way people can interact with my smart contract, ideally a web app, but how can I? since function require some ether transfer, how can the user connect his own address to my application?

Answer 1

You can use web3 and Metamask:

Define the web3 variable, this allows you to interact with your contract

var web3 = new Web3(new Web3.providers.HttpProvider("your ethereum node")); 

To access the functions of the contract you need the definitions of the functions (ABI)

ABI = "put here your contract ABI"

Then you can create an instance of your contract:

var Contract = web3.eth.contract(ABI);
var contractInstance = Contract.at('address of your contract')

Now you can acces the functions of your contrat, for instance the function join:

contractInstance.join.("the_adress", {from:address, value:web3.toWei("Amount",'ether')},(function(err,result){})

This assumes that the user has an account. Metamask will create the account for you and will keep things safe.

This is just a quick overview of how to do it. I hope it helps.