firing an ajax event in uniHTMLFrame

[gbh100]

I am trying to tokenize a credit card in Square using the code below.  I can't get the AjaxEvent to fire.  Any suggestions?

procedure TMainForm.UniFormCreate(Sender: TObject);
begin
  UniHTMLFrame1.HTML.Text :=
    '<script src="https://sandbox.web.squarecdn.com/v1/square.js"></script>' +
    '<div id="card-container"></div>' +
    '<button id="card-button">Pay</button>' +
    '<script>' +
    '  async function initializeSquare() {' +
    '    const payments = Square.payments("YOUR_APPLICATION_ID", "YOUR_LOCATION_ID");' +
    '    const card = await payments.card();' +
    '    await card.attach("#card-container");' +
    '    document.getElementById("card-button").addEventListener("click", async () => {' +
    '      const result = await card.tokenize();' +
    '      if (result.status === "OK") {' +
    '        if (typeof window.external !== "undefined" && typeof window.external.triggerEvent === "function") {' +
    '          window.external.triggerEvent("SquareToken", { token: result.token });' +
    '        } else {' +
    '          console.error("UniGUI triggerEvent is not available.");' +
    '        }' +
    '      } else {' +
    '        console.error("Tokenization failed:", result.errors);' +
    '      }' +
    '    });' +
    '  }' +
    '  initializeSquare();' +
    '</script>';
end;

procedure TMainForm.UniHTMLFrame1AjaxEvent(Sender: TComponent; EventName: string; Params: TUniStrings);
var
  Token: string;
begin
  if EventName = 'SquareToken' then
  begin
    Token := Params.Values['token'];
    ShowMessage('Token received: ' + Token);
  end
  else
    ShowMessage('Unknown event: ' + EventName);
end;
 

[Sherzod]

Hello @gbh100

procedure TMainForm.UniFormCreate(Sender: TObject);
begin
  UniHTMLFrame1.HTML.Text :=
    '<button id="test-button">Test TriggerEvent</button>' +
    '<script>' +
    '  document.getElementById("test-button").addEventListener("click", function() {' +
    //'    if (typeof window.external !== "undefined" && typeof window.external.triggerEvent === "function") {' +
    //'      window.external.triggerEvent("TestEvent", { message: "Hello from JavaScript!" });' +
    '        ajaxRequest('+ UniHTMLFrame1.JSName + ', "TestEvent", { message: "Hello from JavaScript!" })' +
    //'    } else {' +
    //'      console.error("UniGUI triggerEvent is not available.");' +
    //'    }' +
    '  });' +
    '</script>';
end;

[gbh100]

Thanks.

AjaxEvent.zip

[Sherzod]

So, is your issue resolved?

[gbh100]

yes all good