Mint button for my NFT contract

Moralis General
#1

I just want to make a simple button that allows someone to mint an nft from my contracts mint nft function. I already have everything on the site working just trying to sort how to send the payable to the function via moralis.

Right now my page just has the simple transfer button that sends erc20 I just want to add the pointer to the mint function.

1 Like
#2

Hi @Emer,

Please follow the FAQ over here to post your questions -

Also, mention what technology you are using - React.js ? Vanilla Js? Any tutorial you’re following to use moralis?

You can check tutorials on how to mint and use NFTs [excellent new video] -

If you’re using Vanilla JS,
you can use this code to execute the functionality -

Initialise the web3 variable from Moralis

const web3 = await Moralis.enable();

const tokenContract = new web3.eth.Contract(contractAbi, contractAddress);

Mint it the way it’s done below : -

1 Like
#3

Yes I actually watched this today and got some progress made. I have just been pulling bits and pieces from tutorials. My function requires a payable input of ether and quantity to fire off the mint. I got most of the way through it today and started to figure it out it’s just that this tutorial doesn’t show how to pass a payable to the function.

#4

What you mean by passing a payable to a function?

1 Like
#5

You have to pay (x) amount of crypto (x) to receive (x) amount of nft.

The quantity determines the amount of ether to send to the function along with the amount of NFTs your minting.

mint(uint256, _count) is what I have to send

The uint is the ether amount

#6

It is a syntax with value: , you can find it in casino app tutorial on Moralis tutorials.

1 Like
#7

An example:

async function fund(){
    amount = document.getElementById("fund_number").value;
    window.web3 = await Moralis.Web3.enable();
    let contract_instance = new web3.eth.Contract(
        abi, CONTRACT_ADDRESS);
    await contract_instance.methods.fundContract()
        .send({ value: amount, from: ethereum.selectedAddress });
}

that value: amount represents how much of native currency will send (ETH, BNB, etc)

1 Like
#8

this just sends it to the contract but how will i call the actual function mint in my contract?

i have to pass in a count as well not just the value to the contract.

#9

What is your solidity contract code with the function that does that mint?

1 Like
#10 
function mintNFT(uint256 _count) public payable {
        if (msg.sender != owner()) {
            require(saleOpen, "Sale is not open yet");
        }
        require(
            _count > 0 && _count <= 10,
            "Min 1 & Max 10 can be minted per transaction"
        );
        require(
            totalSupply() + _count <= MAX_HS,
            "Transaction will exceed maximum supply"
        );
        require(
            msg.value >= price * _count,
            "Ether sent with this transaction is not correct"
        );

        address _to = msg.sender;

        for (uint256 i = 0; i < _count; i++) {
            _mint(_to);
        }
    }
#11 
    await contract_instance.methods.mintNFT(_count)
        .send({ value: amount, from: ethereum.selectedAddress });
1 Like
#12

Thank you for all your help i think i got it just trying to sort how to find the abi for that function specifically?

when i input the fund value its in wei?

#13

you can put the entire contract ABI if you don’t know how to find that specific function ABI
the input value should be in WEI.

1 Like
#14

@Emer For easy converting to Wei you can use Moralis Units

1 Like
#15

Hey guys im having an issue with the using the moralis server for hosting my files. In the video filip deploys the contract along with the .json files and he is able to pull up the images rhat he used in the folder by entering the directory path he listed in the .jsoon file however when i try to do the same i get a 404 file not found error. Do i need to set up a specific server? I used test net ropsten for ethereum and selected the 2 other chains. The images are in the same directory as the json files so why are they not being located?

#16

Hey @63MoneyT

Please create a new topic for your issue. Also please provide us more info (the best solution is to share your github repo)

1 Like
#17

Ok sorry about that but i think it may be that my server was maxed out, im new to moralis. I didnt know exactly what i would name the topic i andbin my confusion i just chose this thread. I was coding along and i try not to look at the repositories before i at least try on my own

#18

I have it set up to mint like this can you tell me if it does not look right? For some reason i keep getting fund not defined in the console log. Im new to JS so bare with me and thank you for alll you help to this point.

    <script>
        async function fund(){
            amount = document.getElementById("100000000000000000").value;
            window.web3 = await Moralis.Web3.enable();
            let FootieStars = new web3.eth.Contract(('mintStars(uint256)', '1');, 0x9c90Ae0d3D6A29D58Bd57DF06494Ce985496a2fe);
            await FootieStars.methods.mintStars(_count).send({ value: amount, from: ethereum.selectedAddress });
        }

      
      document.getElementById("btn-mint").onclick = fund;
    
            
    </script>
#19

this compiles:

async function fund(){
            amount = document.getElementById("100000000000000000").value;
            window.web3 = await Moralis.Web3.enable();
            let FootieStars = new web3.eth.Contract(('mintStars(uint256)', '1'), 0x9c90Ae0d3D6A29D58Bd57DF06494Ce985496a2fe);
            await FootieStars.methods.mintStars(_count).send({ value: amount, from: ethereum.selectedAddress });
        }
#20

im getting this error in the console now.

“Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘value’)”