How to use BigCommerce utils.api.productAttributes.optionChange

user_18875266 0
Viewed 66

How to use utils.api.productAttributes.optionChange on a React functional component and also when you don't have access to $form.serialize()

I tried to manually create a formData like this but it does not work.

  const addOption = () => {
    const formData = new FormData();
    formData.append("action", "add");
    formData.append("product_id", "459");
    formData.append("optionValue", "12213");
    formData.append("attribute", "25331");

    console.log(formData);

    utils.api.productAttributes.optionChange(
      459,
      formData,
      (err, response) => {
        const attributesData = response.data || {};

        console.log("err: ", err);
        console.log("res: ", response);

        // I just copied this from the documentation but where do I get these methods?
        this.updateProductAttributes(attributesData); 
        this.updateView(attributesData); 
      }
    );
  };

I'm getting these errors though the response status code is 200, and my formData is just empty.

bigcommerce reactjs javascript
1 Answers

It isn't explained in the documentation, but you don't actually need serialized form data, you simply need the attribute ids and values. Try this:

const addOption = () => {

  utils.api.productAttributes.optionChange(
    459,
    'attribute%5B25331%5D=12213',
    (err, response) => {
      const attributesData = response.data || {};

      console.log("err: ", err);
      console.log("res: ", response);

      // I just copied this from the documentation but where do I get these methods?
      this.updateProductAttributes(attributesData); 
      this.updateView(attributesData); 
    }
  );
};
user_150786320
Related