I'm trying to do something simple like Hello World that shows on a webpage. I've written a smart contract like this:
pragma solidity ^0.4.18;
contract HelloContract {
string word = "Hello World!";
function getWord() constant returns (string) {
return word;
}
function setWord(string newWord) returns (string) {
word = newWord;
return word;
}
}
and this the html:
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="./node_modules/web3/dist/web3.min.js"></script>
</head>
<body>
<div class="container">
<center>
<label for="name" class="col-lg-2 control-label">Name:</label>
<input id="name" type="text">
<button id="button">Click!</button>
<h1 id="word"></h1>
</center>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script>
if (typeof web3 !== 'undefined') {
web3 = new Web3(web3.currentProvider);
} else {
// set the provider you want from the Web3.providers
web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"));
}
web3.eth.defaultAccount = web3.eth.accounts[0];
var HelloContract = web3.eth.contract([
{
"constant": false,
"inputs": [
{
"name": "newWord",
"type": "string"
}
],
"name": "setWord",
"outputs": [
{
"name": "",
"type": "string"
}
],
"payable": false,
"stateMutability": "nonpayable",
"type": "function"
},
{
"anonymous": false,
"inputs": [
{
"indexed": false,
"name": "Word",
"type": "string"
}
],
"name": "Word",
"type": "event"
},
{
"constant": true,
"inputs": [],
"name": "getWord",
"outputs": [
{
"name": "",
"type": "string"
}
],
"payable": false,
"stateMutability": "view",
"type": "function"
}
]);
var Hello = HelloContract.at('0xd993de41f4979af7af48c2b5262afb41e63ff4c6');
Hello.getWord(function(error, result){
if(!error)
{
$("#word").html('Hello ' + result[0]);
} else
console.log(error);
});
$("#button").click(function() {
Hello.setWord($("#name").val());
});
</script>
</body>
</html>
what I'm trying to do is, users insert their name (setWord) and it'll display "Hello (username)" (getWord) and all of this running on blockchain means there is a txhash and when I click it'll display "Hello (user)" at the data on etherscan.