"Creating Contract Instance": Main.js doesn't affect's HTML page

Ethereum Smart Contract Programming 201
#1

Hi @filip, and everyone…
I am following up the video on “Creating Contract Instance”…
I followed all instructions on video, but it seems my main.js doesn’t connected to index.html(?); I can not console.log anything… no buttons works…
I tried copy your final code from githhub, copy paste abi[…], copy contract address,… restart python server, ganache, truffle, redeploy contract… but nothing worked…
Could you provide me some recommendations?
P.S: I am all ready stuck there for 3 days and desperately need any help!

ask1
ask12713×1538 252 KB

#2

@filip @gabba
Anyone please help!! :frowning:
I ve been stuck here for already 4 days…
Here are steps I have taken:
1/ Downloaded all finished code from the Github link and saved to …/Dapp
2/ PeopleContract is running smoothly from last lessons and saved to …/People
3/ Started Ganache and added truffle-config ==> connected with People project
4/ Go to …/People folder ==> Truffle Console ==> migrate People contract OK; tested contract on truffle console OK for adding and getting peoples…
5/ Copied abi to abi.js
6/ Copied People COntract address to Main.js
7/ Cmd==> cd …/Dapp folder ==> python3.7 -m http.server … serving OK
8/ Chrome=> localhost:8000 => Can view the App Front page, but buttons don’t react with contract and Console has no reactions to any input, out put…

Did I missed something?

#3

Hi @tungtien
Can you share a github repository it will help me to look at your code.
Can you had a console log inside your “onclick” function to make sure the function is called ?

1 Like
#4

Hi @gabba

While waitting for your reply, I had some progress as follow:
While I pressed F5 to refresh the page, there were no sign of life; But when I pressed Ctrl-F5; On console appears one more Warning as follow:

ask2
ask22725×1487 262 KB

THen I had searched to solve issue: "… favicon.ico file not found " and came up with solution to add flowing line to the head of HTML file:

<link rel="shortcut icon" href="#" />

Then I press ctrl+F5 again and after Adding Data: Dapp runs!
But still there are some errors as follow:

ask3
ask32711×1617 337 KB

I am working on this, but any help from here would be very appreciated. thank you…
Here is the github link for my code:

#5

I gess it caused by this notice on Gas limit 21000 ? tried: Gass Fee>>Edit>>… but still Alert pops up…

gaslimit21000
gaslimit210001077×1600 113 KB

#6

HI guy,
I removed Metamask and install it again, added Ganache ;
Be notice that for default when we connect to Ganache there is already one default Account1 with no balance; When we import Accounts from Ganache bank, the new account will be the second on the row; Thus I had to transfer some funds from newly imported account to Account1 and use Account1 to practice the code… so it works…

1 Like
#7

Hi @tungtien

Sorry for the late answer. When i m testing your contract i have the following issue

MetaMask - RPC Error: WalletMiddleware - Invalid "from" address. Object
(anonymous) @ inpage.js:1
web3.min.js:1 Uncaught (in promise) Error: WalletMiddleware - Invalid "from" address.
{
  "originalError": {}
}

Did you try setting the gas price in your contract

  var config = {value: web3.utils.toWei("1", "ether"),
                gas:100000};

  contractInstance.methods.createPerson(name, parseInt(age), parseInt(height)).send(config)
1 Like
#8

Thank you @gabba,
Now I am working on Coin FLip Project Part1;
But once again got the issue with “Error Pay Load” - Just yesterday I had to remove and install Metamask again. It worked for a while, but then it appears again…
If you ll find the way to get rid of it, please let me know…