getElementById只接受id值，而不接受#选择器语法。所以这个：

var formId = "#productId_1";

应该是这样的：

var formId = "productId_1";

此外，您会发现console.log比alert产生更多有用的信息。所以这个：

alert(formId, a);

应该是这样的：

console.log(formId, a);

有了这些，代码正在工作。formId是所选<form>的id，a是隐藏的<input>。你可以用a.value得到它的值。
例如：

document.addEventListener("DOMContentLoaded",() =>{
    const product1 = document.querySelector("#productId_1")
    const product2 = document.querySelector("#productId_2")
    const product3 = document.querySelector("#productId_3")

    product1.addEventListener("submit",e=>{
        e.preventDefault();
        var formId = "productId_1";
        productList(formId);
    });

    product2.addEventListener("submit",e=>{
        e.preventDefault();
        var formId = "productId_2";
        productList(formId);
    });

    product3.addEventListener("submit",e=>{
        e.preventDefault();
        var formId = "productId_3";
        productList(formId);
    });
});

function productList(formId){
    var a = document.getElementById(formId).getElementsByClassName("productId")[0];
    //testing
    console.log(formId, a.value);
}

<div class="productContainer">
  <h1 class="productTitle">Products:</h1>
  <div class="container">
      <form action="" class="product" id="productId_1">
          <h1>balls</h1>
          <p>a ball bering</p>
          <input type="hidden" class="productId" value="item_1">
          <button class="submit">Purchase</button>
      </form>
  </div>

  <div class="container">
      <form action="" class="product" id="productId_2">
          <h1>balls</h1>
          <p>a ball bering</p>
          <input type="hidden" class="productId" value="item_2">
          <button class="submit">Purchase</button>
      </form>
  </div>

  <div class="container" class="product" id="productId_3">
      <form action="" class="product">
          <h1>balls</h1>
          <p>a ball bering</p>
          <input type="hidden" class="productId" value="item_3">
          <button class="submit">Purchase</button>
      </form>
  </div>
</div>

这里我假设你不知道所有的id，你可能有更多的元素（表单）在以后的时间点。

function productList(formId) {
  const a = document.getElementById(formId).getElementsByClassName("productId")[0];
  //testing
  alert(formId, a);
}

function onSubmitHandler(event) {
  event.preventDefault();
  const formId = event.target.id;
  productList(formId);
}

document.addEventListener("DOMContentLoaded", () => {
  const forms = document.querySelectorAll('form');
  [...forms].forEach(form => form.addEventListener('submit', onSubmitHandler));
});

<div class="productContainer">
  <h1 class="productTitle">Products:</h1>
  <div class="container">
    <form action="" class="product" id="productId_1">
      <h1>balls</h1>
      <p>a ball bering</p>
      <input type="hidden" class="productId" value="item_1">
      <button class="submit">Purchase</button>
    </form>
  </div>

  <div class="container">
    <form action="" class="product" id="productId_2">
      <h1>balls</h1>
      <p>a ball bering</p>
      <input type="hidden" class="productId" value="item_2">
      <button class="submit">Purchase</button>
    </form>
  </div>

  <div class="container" class="product" id="productId_3">
    <form action="" class="product">
      <h1>balls</h1>
      <p>a ball bering</p>
      <input type="hidden" class="productId" value="item_3">
      <button class="submit">Purchase</button>
    </form>
  </div>
</div>

必须从参数formId中删除#才能使用document.getElementById
查看现场Playgroundhttps://codepen.io/dimaslanjaka/pen/YzJMKJa

<div class="productContainer">
  <h1 class="productTitle">Products:</h1>
  <div class="container">
    <form action="" class="product" id="productId_1">
      <h1>balls</h1>
      <p>a ball bering</p>
      <input type="hidden" class="productId" value="item_1">
      <button class="submit">Purchase</button>
    </form>
  </div>

  <div class="container">
    <form action="" class="product" id="productId_2">
      <h1>balls</h1>
      <p>a ball bering</p>
      <input type="hidden" class="productId" value="item_2">
      <button class="submit">Purchase</button>
    </form>
  </div>

  <div class="container" class="product" id="productId_3">
    <form action="" class="product">
      <h1>balls</h1>
      <p>a ball bering</p>
      <input type="hidden" class="productId" value="item_3">
      <button class="submit">Purchase</button>
    </form>
  </div>
</div>
<script>
console.clear();

document.addEventListener("DOMContentLoaded", () => {
  const product1 = document.querySelector("#productId_1");
  const product2 = document.querySelector("#productId_2");
  const product3 = document.querySelector("#productId_3");

  product1.addEventListener("submit", function (e) {
    e.preventDefault();
    productList(this.id);
  });

  product2.addEventListener("submit", function (e) {
    e.preventDefault();
    productList(this.id);
  });

  product3.addEventListener("submit", function (e) {
    e.preventDefault();
    productList(this.id);
  });
});

function productList(formId) {
  const a = document.getElementById(formId);
  let hiddenInput;

  if (a) {
    hiddenInput = a.getElementsByClassName("productId")[0];
  }

  //testing
  alert(`hidden input of form #${formId} has value ${hiddenInput.value}`);
}
</script>