无法从JavaScript调用Delphi ActiveX方法

Question

I have issue with a Delphi ActiveX control. I create an ActiveX library and then an ActiveX form. I define one function and I want to call this function from JavaScript. But I can't. JavaScript throws an error: "Object doesn't support property or method 'Method1'".

This is the HTML code:

<OBJECT id="GetDocsActiveX" classid="clsid:A03962E6-6030-46C0-988D-ADE26BC4BACD" codebase="GetDocs.ocx#version=1.0">
    <PARAM NAME="Color" VALUE="13417386">
</OBJECT>

This is the Delphi code *.ridl file

interface IGetDocs: IDispatch
{
    [id(0x000000E8)]
    HRESULT _stdcall Method1(void);
};

this is *_TLB.pas file

IGetDocs = interface(IDispatch)
    ['{8F2BF1C6-98A5-4D6B-A43E-890698A3C91D}']   
    procedure Method1; safecall;
end;

and this is file with implementation

unit GetDocsU;
{$WARN SYMBOL_PLATFORM OFF}
interface
uses
    Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,
    ActiveX, AxCtrls, GetDocs_TLB, StdVcl, Vcl.StdCtrls, ShellApi, Vcl.XPMan, 
    IdBaseComponent, IdComponent, IdTCPConnection, IdTCPClient, IdHTTP;

type
    TGetDocs = class(TActiveForm, IGetDocs)    
protected    
     procedure Method1; safecall;
public
    { Public declarations }
     procedure Initialize; override;
end;

implementation

uses ComObj, ComServ;
{$R *.DFM}
procedure TGetDocs.Method1;

begin      
       MessageDlg('HI from active x', mtInformation, [mbOK], 0, mbOK);
end;

end.

Can anyone help with this issue. I try to move method in public section in published section without success.

EDIT here is java script

<script type="text/javascript">
try {
        var obj = $("#GetDocsActiveX");
        if (obj) {
            obj.Method1();
        } else {
            alert("Object is not created!");
        }
    } catch (ex) {
        alert("Some error happens, error message is: " + ex.message);
    }
</script>

Answer 1

I noticed at least this one error:

var obj = $("#GetDocsActiveX");

That looks like a line of jQuery (or similar library) to get the element with the id 'GetDocsActiveX'. But jQuery doesn't return the element directly. It returns a jQuery object that wraps a collection of elements. You try to call the method of that jQuery object instead of the actual element you're looking for.

There are ways to unravel that element from the jQuery collection, but I think it's easier to just get the object using plain JavaScript:

var obj = document.getElementById("GetDocsActiveX");

or if you enjoy working with selectors:

var obj = document.querySelector("#GetDocsActiveX");