JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div">
    Form 1:
    <form id="myForm" method="post">
        Enter your name: zig <input type="text" id="name" />
        <br/>
        <input type="submit" value="submit" />
    </form>
</div>
<br/>
<div class="div">
    Form 2:
    <form id="mySecondForm" method="post">
        Enter your name: <input type="text" id="nameTwo" />
        <br/>
        <input type="submit" value="submit" />
        <br/>
        Enter you number: <input type="text" id="numberTwo" />
        <br/>
        <input type="submit" value="submit" />
    </form>
</div>

CSS

.div{
    border: 1px solid red;
    padding: 2px;
}

JavaScript

$(document).ready(function() {
   
    $('#myForm').submit(function(e){
        e.preventDefault();
        alert($("#name").val());
        diableButton($('input[type=submit]', this));
    });
    
    $('#mySecondForm').submit(function(e){
        e.preventDefault();
        alert($("#nameTwo").val() + '- ' + $("#numberTwo").val());
        diableButton($('input[type=submit]', this));
    });
    
   
    // Function to disable a button:
    function diableButton(bID)
    {
        $(bID).attr('disabled', 'disabled');
    }
    
});