Crossmint button error: NFT count must be a string or number

Question

I'm trying to implement the Crossmint button as per the docs here: https://docs.crossmint.com/docs/crossmint-pay-button

but I'm getting the error NFT count must be a string or number (see photo). Has anyone run into this before? Any help would be greatly appreciated.

My mint function is

  function crossMint(address _crossmintReciever, uint256 _mintAmount) public payable mintCompliance(_mintAmount) {
    require(!paused, "The contract is paused!");
    require(!allowListActive, "Public mint has not started");
    require(msg.value >= cost * _mintAmount, "Insufficient funds!");
    require(msg.sender == crossmintAddress, "This function is for Crossmint users only!");

    _mintLoop(_crossmintReciever, _mintAmount);


  }

function _mintLoop(address _receiver, uint256 _mintAmount) internal {
    for (uint256 i = 0; i < _mintAmount; i++) {
      supply.increment();
      _safeMint(_receiver, supply.current());
    }
  }

I have used both string and number format for the amount fields, and also tried a contract that uses counters to track tokenIDs and another that uses Strings

Answer 1

Without knowing your clientId I cannot say for sure. But usually when I see this error it's because the developer is using a different attribute name than what is used for the mint function argument.

For example. Your mint function accepts _mintAmount for the NFT count/quantity. Check your button code to ensure it is set there also.

For example: (vanilla js sdk)

<crossmint-pay-button
    clientId="_YOUR_CLIENT_ID_"
    mintConfig='{
        "totalPrice":"0.001",
        "_mintAmount": "1"
    }'
    environment="staging"
/>

or react sdk:

<CrossmintPayButton
    clientId="_YOUR_CLIENT_ID_"
    mintConfig={{
        totalPrice: "0.001",
        _mintAmount: "1",
    }}
    environment="staging"
/>

You may be using a different attribute name in the mintConfig such as:

_quantity, quantity, qty, amount, when it should be _mintAmount.