diff --git a/packages/theme-product-form/__tests__/theme-product-form.test.js b/packages/theme-product-form/__tests__/theme-product-form.test.js
index 4c414de7..5d6c0653 100644
--- a/packages/theme-product-form/__tests__/theme-product-form.test.js
+++ b/packages/theme-product-form/__tests__/theme-product-form.test.js
@@ -42,6 +42,7 @@ beforeEach(() => {
       <option value="110 Volts">110 Volts</option>
     </select>
 
+    <input type="text" name="id" value="20230103745" />
     <input type="radio" name="options[Size]" value="Small" checked />
     <input type="radio" name="options[Size]" value="Large" />
 
diff --git a/packages/theme-product-form/theme-product-form.js b/packages/theme-product-form/theme-product-form.js
index 3b92ab9f..53d669af 100644
--- a/packages/theme-product-form/theme-product-form.js
+++ b/packages/theme-product-form/theme-product-form.js
@@ -46,27 +46,47 @@ export function ProductForm(element, product, options) {
 
   options = options || {};
 
-  this._listeners = new Listeners();
-  this._listeners.add(
-    this.element,
-    'submit',
-    this._onSubmit.bind(this, options)
-  );
+  if(options.selectors) {
+    selectors = {
+      idInput: options.selectors.idInput || selectors.idInput,
+      optionInput: options.selectors.optionInput || selectors.optionInput,
+      quantityInput: options.selectors.quantityInput || selectors.quantityInput,
+      propertyInput: options.selectors.propertyInput || selectors.propertyInput
+    };
+  }
 
+  this._idInput = this.element.querySelector(selectors.idInput);
+  if(!this._idInput) {
+    throw new Error("element must contain id input");
+  }
+
+  this._listeners = new Listeners();
   this.optionInputs = this._initInputs(
     selectors.optionInput,
-    options.onOptionChange
+    this._onOptionChange.bind(this, options)
   );
 
-  this.quantityInputs = this._initInputs(
-    selectors.quantityInput,
-    options.onQuantityChange
-  );
+  if(options.onFormSubmit) {
+    this._listeners.add(
+      this.element,
+      'submit',
+      this._onSubmit.bind(this, options)
+    );
+  }
 
-  this.propertyInputs = this._initInputs(
-    selectors.propertyInput,
-    options.onPropertyChange
-  );
+  if (options.onQuantityChange) {
+    this.quantityInputs = this._initInputs(
+      selectors.quantityInput,
+      options.onQuantityChange
+    );
+  }
+
+  if (options.onPropertyChange) {
+    this.propertyInputs = this._initInputs(
+      selectors.propertyInput,
+      options.onPropertyChange
+    );
+  }
 }
 
 /**
@@ -132,17 +152,20 @@ ProductForm.prototype.quantity = function() {
 
 // Private Methods
 // -----------------------------------------------------------------------------
-ProductForm.prototype._setIdInputValue = function(value) {
-  var idInputElement = this.element.querySelector(selectors.idInput);
-
-  if (!idInputElement) {
-    idInputElement = document.createElement('input');
-    idInputElement.type = 'hidden';
-    idInputElement.name = 'id';
-    this.element.appendChild(idInputElement);
+ProductForm.prototype._setIdInputValue = function (value) {
+  this._idInput.value = value.toString();
+};
+
+ProductForm.prototype._onOptionChange = function (options, event) {
+  event.dataset = this._getProductFormEventData();
+
+  if (event.dataset.variant) {
+    this._setIdInputValue(event.dataset.variant.id);
   }
 
-  idInputElement.value = value.toString();
+  if (options.onOptionChange) {
+    options.onOptionChange(event);
+  }
 };
 
 ProductForm.prototype._onSubmit = function(options, event) {