Step by Step tutorial to create MFC ActiveX Control which can be used in HTML Pages

Definition: ActiveX controls are COM components which are self-registering and Implements standard interfaces that deal specifically with GUI-based tasks such as rendering, sizing, activation, and property persistence.

An ActiveX control is anything you might see in the Toolbox of Visual studio (i.e. EditBox, combobox e.t.c) we can even use the Activex controls in web pages using and handling events with Javascript.


Steps
1. Open VS 2008
2. File->NewProject give the project name as “MathOCX”
3.Click OK and Click Finish
4. To add a method
- Go to class View, Expand “MathOCXLib”
- RightClick on the “_DMathOCX” and click ‘Add >’ Add Method…
5. ‘Add Method Wizard’ Dialog will be displayed as shown in below fig
Add the function returntype, parameter and function names as Add and Sub

DOUBLE Add(DOUBLE i, DOUBLE j)
DOUBLE Sub(DOUBLE i, DOUBLE j);

4. Three Major classes are created
class CMathOCXApp : public COleControlModule
class CMathOCXCtrl : public COleControl
class CMathOCXPropPage : public COlePropertyPage

Descriptions of the Generated classes & Notes 

class CMathOCXApp : public COleControlModule -> CWinApp
COleControlModule provides member functions for initializing control module it is an application object for running the ActivexControl. Only one global object is present.
class CMathOCXCtrl : public COleControl

1.COleControl Derived from CWnd, this class inherits all the functionality of a Windows window object plus additional functionality specific to OLE, such as event firing and the ability to support methods and properties.

2. COleControl has a dispatch map, which is used to expose a set of functions (called methods) and attributes (called properties) to the control user.
Dispatch Maps
1. OLE Automation provides ways to call methods and to access properties across applications.
2. The mechanism supplied by the MFC for dispatching these requests is the “dispatch map,” which designates the internal and external names of object functions and properties, as well as the data types of the properties themselves and of function arguments.

DISP_FUNCTION(theClass, pszName, pfnMember, vtRetVal, vtsParams )

Parameters
theClass - Name of the class.
pszName - External name of the function.
pfnMember - Name of the member function.
vtRetVal - A value specifying the function’s return type.
vtsParams - A space-separated list of one or more constants specifying the function’s parameter list.

Example: DISP_FUNCTION_ID(CMathOCXCtrl, “Add”, dispidAdd, Add, VT_R8, VTS_R8 VTS_R8)

class CMathOCXPropPage : public COlePropertyPage
Used to display the properties of a custom control in a graphical interface, similar to a dialog box.
Using MathOCX.ocx control in the HTML Page
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 8.0">
<TITLE></TITLE>
    <style type="text/css">
 .style1
        {
            width: 25%;
        }
 .style2
 { color: #0000CC;
            font-weight: 700;
        }
 .style3
        {
 width: 213px;
        }
    </style>
</HEAD>

<script type="text/javascript">
    function Button1_onclick() {

 //Call the MathOCX Add Method
        Result.value = MathOCX.Add(Text1.value, Text2.value);
    }
</script>

<BODY onload="initPage()" scroll="no">
    <table class="style1">
        <tr>
            <td class="style2" colspan="2">
 Addition of two numbers using MathOCX ActiveX Control
        </tr>
        <tr>
            <td class="style3">
                Enter number :</td>
            <td>
                <input id="Text1" type="text" /></td>
        </tr>
        <tr>
            <td class="style3">
                Enter number :</td>
            <td>
                <input id="Text2" type="text" /></td>
        </tr>
        <tr>
            <td class="style3">

    <input id="Button1" type="button" value="Add" onclick="return Button1_onclick()" />
                Result:</td>
            <td>
                <input id="Result" type="text" />
            </td>
        </tr>
    </table>

<!--Initialize the <span class="hiddenSpellError" pre="the ">MathOCX</span> <span class="hiddenSpellError" pre="">Activex</span> Control using the control GUID --></pre>
&nbsp;
<pre>
<pre>
 style="left: 0px; top: 0px" width="1" viewastext>
            <param name="_Version" value="65536"/>
            <param name="_ExtentX" value="26"/>
            <param name="_ExtentY" value="26"/>
            <param name="_StockProps" value="0"/>
      </object>

</BODY>
</HTML>
About these ads

One thought on “Step by Step tutorial to create MFC ActiveX Control which can be used in HTML Pages

  1. Hello very cool web site!! Guy .. Beautiful .. Amazing .. I will bookmark your blog and take the feeds also?I’m glad to seek out numerous helpful info here within the put up, we’d like work out extra strategies in this regard, thanks for sharing. . . . . .

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s