0

We are builidng react components for a php app, it doesn't really have much intergration but there's a php save button that is should listen for and save onclick. But there's a catch, for some reason most of functions i'm trying to use are just not getting ran. I'm working with react-form-hook and trying to run the onsubmit() with my function inside.

 handleSubmit((data) => {
          handleSaveOrderProducts(data, selectedProductsRef.current);
 });

To assign this function to the button i have to listen for the button clicks with id, i tried different approaches but none seems to fix the problem. Ways to listen i tried: Using https://www.npmjs.com/package/react-detect-click-outside#features lib

 const productInformationContainerRef = useDetectClickOutside({
    onTriggered(event) {
      // @ts-ignore
      if (event.target?.id === "save-order-button") {
        console.log("save order button");
        handleSubmit((data) => {
          handleSaveOrderProducts(data, selectedProductsRef.current);
        });
      }
    },
  });

What i get in result? The callback itself runs, but the function (handlesubmit) is not. Even if i put a console.log in callback with data there's just nothing displayed.

Different approaches from this stackoverflow thread, mostly everything related to functional react Detect click outside React component . If you had experience in something like this or have any theoretical knowledge please comment :)strong text

Alan
  • 91
  • 1
  • 6

0 Answers0