Origin C HTML Dialog with JavaScript Support

Origin C now supports using HTML to build dialog boxes in Origin without using a resource DLL. This not only removes the need to use Visual Studio to build a resource DLL but to allow making use of the vast array of utilities available in the public domain for web page constructions. In order to access and control the elements in the HTML dialog, JavaScript integration has been added in Origin 2017, which provides methods for Origin C calling JavaScript and JavaScript calling Origin C. In addition, an Origin graph control can overlap the HTML control so that both of them can be placed arbitrarily and well organized in the dialog.

This guide contains a tutorial that shows how to create an HTML page and then how to use Origin C to display the HTML page as a control in the dialog. Additional sections describe in more detail how to create an HTML dialog with a graph control and how does Origin C calling JavaScript works and vice versa.


Sample files of this tutorial, including the *.cpp file, the *.html file, the related *.css files and *.js file, are available for download

If you'd like to learn more about HTML dialog, please see this page for a nice collection of often useful examples.

This section covers the following topics:

In Origin, the newHTML X-Function is provided to create a simple HTML dialog easily and quickly. The HTML file and CPP file created by this X-Function are like the templates, you can redesign your HTML dialog based on these two files. Once you go through all tutorials and have the basics about HTML dialog, you can use the newHTML X-Function to construct starter HTML dialog. In Code Builder interface, you can easily select menu Tools:New HTML Dialog... to launch this X-Function.