Web3.js and MetaMask ethereum.request: is it possible to specify specific crypto/token used to pay?

Question

I will have a few "Click to Pay" buttons on a website that accepts crypto, using web3.js and MetaMask. I want to make sure different buttons automatically direct the user to use different currencies, such as ETH, MATIC, and other ERC-20 tokens, etc.

I'm not sure how to do this with the following code, which seems to work with whatever network the user is connected to:

const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
const account = accounts[0];
console.log(account);   
var hex_value = '0x'+parseInt(my_input['amount'], 10).toString(16); // gets me the right value in hex

const transactionParameters = {
    from: account,
    to: MyContractAddr,
    data: MyContract.methods.processPayment(
        my_input['name'],
        my_input['amount'],
        my_input['date']
    ).encodeABI(),
    value: hex_value,
};
// popup - request the user to sign and broadcast the transaction
await ethereum.request({
    method: 'eth_sendTransaction',
    params: [transactionParameters],
});

How can I make the above specific to a particular cryptocurrency, eg ETH or MATIC? It seems to work fine with either, but as the user on the website, I manually select which network I am and which currency I'm using via MetaMask, so I'm confused. I want this to be decided automatically rather than the user being able to pay "20 units" of "whatever" crypto.

Answer 1

How can I make the above specific to a particular cryptocurrency, eg ETH or MATIC? I

ERC-20 tokens are identified by their smart contract address. You can use a token search to find the smart contract address of a token you want to make payment with . Then the user makes transfer() or transferFrom() call to the token smart contract to complete the payment.