CRYPTO NEWS

How To Write a Smart Contract and JS Script that gets Data About Transactions and displays it

I wrote a smart contract that stores, read, updates and deletes data from the blockchain for my Online Birth Registration system. I’d like to know how I can write a smart contract that gets and the data about the transactions. Like the ones Remix shows when a contract is deployed. Like the one shown here Remix transaction meta data

Below is my Solidity code

pragma solidity >=0.4.22 <0.9.0;    contract Registration {     struct Child {         uint256 id;         string name;         string placeOfBirth;         string motherFullname;         string motherNRC;         string bo; //birthOccurence         string gender;         string pAddress;      }      //create struct type array to store values     Child[] public child;     uint256 nextId = 1;      function find(uint256 _id) public view returns (uint256) {         for (uint256 i; i < child.length; i++) {             if (child[i].id == _id){ return i;             }         }         revert("Record does not exist.");     }      function insertRecord(         string memory _name,         string memory _placeOfBirth,         string memory _motherFullname,         string memory _motherNRC,         string memory _bo,         string memory _gender,         string memory _pAddress     ) public {         child.push(Child(nextId, _name, _placeOfBirth, _motherFullname, _motherNRC, _bo, _gender, _pAddress));         nextId++;     }      function readRecordById(uint256 _id)         public         view         returns (uint256, string memory, string memory, string memory,          string memory, string memory, string memory, string memory)     {         uint256 i = find(_id);         return (             child[i].id,             child[i].name,             child[i].placeOfBirth,             child[i].motherFullname,             child[i].motherNRC,             child[i].bo,             child[i].gender,             child[i].pAddress         );     }      function updateRecordById(         uint256 _id,         string memory _name,         string memory _placeOfBirth,         string memory _motherFullname,         string memory _motherNRC,         string memory _bo,         string memory _gender,         string memory _pAddress      ) public {         uint256 i = find(_id);         child[i].name = _name;         child[i].placeOfBirth = _placeOfBirth;         child[i].motherFullname = _motherFullname;         child[i].motherNRC = _motherNRC;         child[i].bo = _bo;         child[i].gender = _gender;         child[i].pAddress = _pAddress;     }      function deleteRecordById(uint256 _id) public returns (uint256) {         uint256 i = find(_id);         delete child[i];     } } 

The following is the corresponding javascript code that allows for the data to be displayed on the front end

import Web3 from "web3"; import Registration from "../build/contracts/Registration.json";  let web3, registration; // let spinner = document.getElementById("loader"); const initWeb3 = () => {   return new Promise((resolve, reject) => {     if (typeof window.ethereum !== "undefined") {       const web3 = new Web3(window.ethereum);       window.ethereum         .enable()         .then(() => resolve(new Web3(window.ethereum)))         .catch((error) => reject(error));     }     if (typeof window.web3 !== "undefined") {       return resolve(new Web3(window.web3.currentProvider));     }     resolve(new Web3("http://localhost:8545"));   }); };  const initContract = () => {   const deploymentKey = Object.keys(Registration.networks)[0];   return new web3.eth.Contract(Registration.abi, Registration.networks[deploymentKey].address); };  const initApp = () => {   const $create = document.getElementById("create");   const $createResult = document.getElementById("create-result");   const $read = document.getElementById("read");   const $readResult = document.getElementById("read-result");   const $edit = document.getElementById("edit");   const $editResult = document.getElementById("edit-result");   const $delete = document.getElementById("delete");   const $deleteResult = document.getElementById("delete-result");    //get all the accounts   let accounts = [];   web3.eth.getAccounts().then((acc) => (accounts = acc));    $create.addEventListener("submit", (e) => {     e.preventDefault();     const name = e.target.elements[0].value;     const placeOfBirth = e.target.elements[1].value;     const motherFullname = e.target.elements[2].value;     const motherNrc = e.target.elements[3].value;     const bo = e.target.elements[4].value;     const gender = e.target.elements[5].value;     const pAddress = e.target.elements[6].value;       const record = registration.methods       .insertRecord(name, placeOfBirth, motherFullname, motherNrc, bo, gender, pAddress)       .send({ from: accounts[0] });     document.getElementById("loader").style.display = "block";     record.then((result) => {       document.getElementById("loader").style.display = "none";       console.log(result);       $createResult.innerHTML = `Birth Registration succesfful! New Record has been added:<br/>        Name: ${name}<br/> POB: ${placeOfBirth}<br/> Mother's Name: ${motherFullname}<br/>         Mother's ID: ${motherNrc}<br/> Birth Occurence: ${bo}<br/> Gender: ${gender}<br/> Address: ${pAddress}`;     });   });    $read.addEventListener("submit", async (e) => {     e.preventDefault();     const id = e.target.elements[0].value;     registration.methods       .readRecordById(id)       .call()       .then((result) => {         $readResult.innerHTML = `Record Available:<br/> Id: ${result[0]}<br/> Name: ${result[1]}<br/> POB: ${result[2]}<br/>          Mother's Name: ${result[3]}<br/> Mother's ID: ${result[4]}<br/> Birth Occurence: ${result[5]}<br/> Gender: ${result[6]}<br/>         pAddress: ${result[7]}`;       })       .catch((_e) => {         $readResult.innerHTML = `Ooops... there was an error while trying to retrive records of ${id}`;       });   });    $edit.addEventListener("submit", (e) => {     e.preventDefault();     const id = e.target.elements[0].value;     const name = e.target.elements[1].value;     const placeOfBirth = e.target.elements[2].value;     const motherFullname = e.target.elements[3].value;     const motherNrc = e.target.elements[4].value;     const bo = e.target.elements[5].value;     const gender = e.target.elements[6].value;     const pAddress = e.target.elements[7].value;        registration.methods       .updateRecordById(id, name, placeOfBirth, motherFullname, motherNrc, bo, gender, pAddress)       .send({ from: accounts[0] })       .then((result) => {         $editResult.innerHTML = `Record details updated succesfully: <br/> ${id}<br/> Name: ${name}<br/> POB: ${placeOfBirth}<br/> Mother's Name: ${motherFullname}<br/>          Mother's ID: ${motherNrc}<br/> Birth Occurence: ${bo}<br/> Gender: ${gender}<br/> Address: ${pAddress}`;       })       .catch((_e) => {         $editResult.innerHTML = `Ooops... there was an error while trying to update name of user ${id} to ${name}`;       });   });    $delete.addEventListener("submit", (e) => {     e.preventDefault();     const id = e.target.elements[0].value;     registration.methods       .DeleteRecordById(id)       .send({ from: accounts[0] })       .then((result) => {         $deleteResult.innerHTML = `Record has been deleted: ${id}`;       })       .catch((_e) => {         $deleteResult.innerHTML = `Ooops... there was an error while trying to delete iser ${id}`;       });   }); };  document.addEventListener("DOMContentLoaded", () => {   initWeb3()     .then((_web3) => {       web3 = _web3;       registration = initContract();       initApp();     })     .catch((e) => console.log(e.message)); });  

How To Write a Smart Contract and JS Script that gets Data About Transactions and displays it

Shopping cart
There are no products in the cart!
Continue shopping
0