Make a custom text requirement on dynamic store page.

Ask the community
, ,
1

I have a custom store page made with dynamic pages, and I wonder how can I link a text input box to my custom text requirement on my product?

I need a way for the text to be a requirement, so you can’t add to cart without writing in it.
Also it has a character limit of 20. Is this also something that is dynamic?

2 

import { cart } from "wix-stores";
const customInput = $w("#textInput");
const buttonAddToCart = $w("#buttonAddtocart");

$w.onReady(async function () {
    customInput.maxLength = 20;
    customInput.required = true;
    buttonAddToCart.onClick(async () => {
        if (customInput.valid) {
          try {
            const product = [{
              productId: "", //REPLACE with product ID
              quantity: 1,
              options: {
                customTextFields: {
                  title: "",
                  value: customInput.value,
                },
              },
            }];
            await cart.addProducts(product);
          } catch (error) {
            console.log(error);
          }
        } else {
          customInput.updateValidityIndication();
        }
      });      
});