Linking Delphi and Javascript

How to create an ActiveX and link it to JavaScript in an HTML document.

With the Delphi Active Form it is easy to create an ActiveX (OCX)

component what can be integrated into programs like VB, VBA

(Word, Excel, Access, and Outlook), Delphi, C++, and in this case

the IE Web-Browser via a HTML document.



From the Delphi IDE File | New menu, display the New Item dialog box,

and from the ActiveX tab select the Active Form option.



The Active Form creates a new Active Form, which is a simpler

ActiveX control (descended from the TActiveForm) pre-configured to

run in a Web Browser. The ActiveX Control Wizard appears to guide

you through the creation process, allowing you to add controls to

the form. The Wizard creates an ActiveX Library project (if needed),

a type library, a form, an implementation unit, and a unit containing

corresponding type library declarations.



Enter the New ActiveX Name in the Active Form Wizard. Change the

Implementation Unit name and Project name as needed.



Choose the threading model to indicate how COM serializes calls to

your ActiveX control.



Note: The threading model you choose determines how the object is

registered. You must make sure that your object implementation

adheres to the model selected.




Before activate the OK button check the required Control Options.

For more information use the Help button.



Add a property:

Display the projects xx_TLB.Pas file. From the Edit Window hit the

F12 to display the .Tlb form.

Under the Project you will find the Interface entry. If you expand

the entry you will see several pre-created properties. Right click

in the outline area and select the New | Property option. Two

Properties is added to the outline: The get and the put Property.

Enter the name and the type for the Properties.



In the protected area of the Class you will find a function and a

procedure matching the new Property. In the implementation section

you also will find the two functions and procedure. Add the

appropriated code to the function and the procedure.



function TActiveXtest1.Get_Entry: WideString;

begin

  Result := EditEntry.Text; // Read the TEdit text

end;



procedure TActiveXtest1.Set_Entry(const Value: WideString);

begin

  EditEntry.Text := Value; // Set the TEdit text

end;





Add an Event:

Open the Event section in the outline and right click. Select the

New | Method option. Give the Method a name like OnSubmit.



Lets say you want to assign a button click on the form with the new

event. Insert the following code under the button click procedure.



procedure TActiveXtest1.ButtonSubmitClick(Sender: TObject);

begin


  If FEvents <> Nil Then

  Begin

    FEvents.OnSubmit; // OnSubmit is the new event

  End;

end;



Compile the application. From the IDE Run menu you can register and

unregister the ActiveX with the registry.



The IDE can create an HTML test document for you to test the ActiveX.



<HTML>

<H1> Delphi 5 ActiveX Test Page </H1><p>

You should see your Delphi 5 forms or controls embedded in the form below.

<HR><center><P>

<OBJECT

classid="clsid:83613669-F82A-4EF6-AADB-F7BD04559711"

codebase="C:/A/Delphi5/Test/ActiveX/Test1/ActiveXtest1Proj1.inf"

id="ActiveXtest1"

width=217

height=89

align=center

hspace=0

vspace=0

>

</OBJECT>

</HTML>



You can change the code base to use the OCX instead of the INF file:



codebase="C:/NTS/Check/CheckIt.Ocx"



The code base is where the ActiveX is located so if it is not

registered with the registry the Web Browser knows where to find the

OCX.



When loaded from a web-site the code base should point to the URL

where the OCX can be found.



codebase="\activex\checkit.ocx"



You need to read a write the ActiveX property, which can be done with

a VBScript:



<script language="VBScript">

<!-- hide from old browsers

Sub NewAccount(Account)

    NtsCheckIt.AccountNo = Account

End Sub

//-->

</script>

 

Or it can be done with a JavaScript:



<script language="JavaScript">

<!-- hide from old browsers

function new_account_no(account)

{

  NtsCheckIt.AccountNo = account;

}

//-->

</script>



So fare so good. Now we get to the best part connecting the event

in the ActiveX OCX and the HTML document.



In the VBScript world you would do the following:



<!--VBScript eg-->

<script language="VBScript">

<!-- hide from old browsers

Sub NtsCheckIt_OnSubmit()

    MsgBox NtsCheckIt.AccountNo

End Sub

</script>



The same can also be done in the JavaScript:



<SCRIPT LANGUAGE="JavaScript" EVENT="OnSubmit" FOR="NtsCheckIt">

<!--

alert("Account # " + NtsCheckIt.AccountNo);

// -->

</SCRIPT>



Conclusion:

With the Delphi Active Form you can easily develop ActiveX OCX.

Drop TEdits and TButtons on the form and you have input and output

to the OCX. With the .TLB form you can add Properties and Event

which can be connected to an HTML document via VBScript or JavaScript.

 

Share this article!

Follow us!

Find more helpful articles: