JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="row">
        <div class="col col-xs-3">
            ご注文の商品
        </div>
        <div class="col col-xs-8">
            <span th:text="${order['注文asString']}"></span>
        </div>
    </div>
    <a th:href="${'./SearchOrders?searchTerm='+tld}">トップレベルドメインから検索</a><br/>
    <a th:href="${'./SearchOrders?searchTerm='+domain}">ドメインから検索</a><br/>
    <a th:href="${'./SearchOrders?searchTerm='+order['メールアドレス']}">メールアドレスから検索</a><br/>
    <div id="change_form">
    <div class="row"><div class="text-r col col-xs-3">帳票コード</div><div class="col col-xs-4"><span th:text="${order['帳票コード']}"></span></div></div>
    <div class="row"><div class="text-r col col-xs-3"><label for="顧客番号">顧客番号</label></div><div class="col col-xs-8"><form action="./UpdateOrder" method="POST"><input  style="width:80%" type="text" th:name="value" id="顧客番号" th:value="${order['顧客番号']}"/><input type="hidden" th:name="column" th:value="顧客番号"/><input type="hidden" th:name="formNo" th:value="${order['帳票コード']}"/><input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/><input type="submit" value="更新"/></form></div></div>
    <div class="row"><div class="text-r col col-xs-3"><label for="見積番号">見積番号</label></div><div class="col col-xs-8"><form action="./UpdateOrder" method="POST"><input  style="width:80%" type="text" th:name="value" id="見積番号" th:value="${order['見積番号']}"/><input type="hidden" th:name="column" th:value="見積番号"/><input type="hidden" th:name="formNo" th:value="${order['帳票コード']}"/><input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/><input type="submit" value="更新"/></form></div></div>
    <div class="row"><div class="text-r col col-xs-3"><label for="発注番号">発注番号</label></div><div class="col col-xs-8"><form action="./UpdateOrder" method="POST"><input  style="width:80%" type="text" th:name="value" id="発注番号" th:value="${order['発注番号']}"/><input type="hidden" th:name="column" th:value="発注番号"/><input type="hidden"...

JavaScript

var formList = [];
    var dateInput = document.querySelectorAll("#change_form input[type='text'],#change_form textarea");

    // for文でdateInputの回数だけ回し、その都度.pushで配列に値を入れる
    for(var i=0; i< dateInput.length; i++) {
        formList.push(dateInput[i].value);
    }
    // submitの配列定義と取得
    var subbtnList = [];
    var subbtn = document.querySelectorAll("#change_form input[type='submit']");

    // for文でsubbtnListの回数だけ回し、その都度.pushで配列に入れる
    for(var n=0; n< subbtn.length; n++) {
        subbtnList.push(subbtn[n]);
    }

    // addEventListenerを使いmarkAsEditedを、input（に入力があったら）で発火させる
    document.addEventListener("input", function(e){markAsEdited(e)});

    // 呼び出されたら、背景色を変える
    function markAsEdited(e) {
        var t = e.target;
        t.style.backgroundColor = "yellow";

        // 現在の入力部分の値をelementsとして取得し、for文で発火させた以外の入力箇所とsubmitにdisabledを有効化
        // if文で最初に作った配列formListと比較し、elementsの値が同じ列のdisabledを有効にする
        var elements = document.querySelectorAll("#change_form input[type='text'],#change_form textarea");
        for (var i = 0; i < elements.length; i++) {
            if(elements[i].value == formList[i]) {
                subbtn[i].disabled = true;
                elements[i].disabled = true;
            }
        }
    }