Markup and Scripting

The HTML markup for a wijEditor widget looks like this.

Markup	Copy Code
<textarea id="wijeditor" style="width: 650px; height: 400px;"> <h2>History</h2> <p> JavaScript was originally developed by Brendan Eich of Netscape under the name Mocha, which was later renamed to LiveScript, and finally to JavaScript. LiveScript was the official name for the language when it first shipped in beta releases of Netscape Navigator 2.0 in September 1995, but it was renamed JavaScript in a joint announcement with Sun Microsystems on December 4, 1995, when it was deployed in the Netscape browser version 2.0B3. </p>

Markup

Copy Code

<textarea id="wijeditor" style="width: 650px; height: 400px;">
    <h2>History</h2>
    <p>
        JavaScript was originally developed by Brendan Eich of
        Netscape under the name Mocha, which was later renamed to LiveScript, and finally to JavaScript. LiveScript was the official name for the language when it
        first shipped in beta releases of Netscape Navigator 2.0 in September 1995, but it was renamed JavaScript in a joint announcement with Sun Microsystems on
        December 4, 1995, when it was deployed in the Netscape browser version 2.0B3.
    </p>

You can initialize the widget with the following jQuery script.

Script	Copy Code
<script type="text/javascript"> requirejs.config({ baseUrl: "http://cdn.wijmo.com/amd-js/3.20161.90", paths: { "jquery": "jquery-1.11.1.min", "jquery-ui": "jquery-ui-1.11.0.custom.min", "jquery.ui": "jquery-ui", "jquery.mousewheel": "jquery.mousewheel.min", "globalize": "globalize.min" } }); </script> <script id="scriptInit" type="text/javascript"> require(["wijmo.wijeditor"], function () { $(document).ready(function () { $("#wijeditor").wijeditor(); }); }); </script>

Script

Copy Code

<script type="text/javascript">
    requirejs.config({
        baseUrl: "http://cdn.wijmo.com/amd-js/3.20161.90",
            paths: {
                "jquery": "jquery-1.11.1.min",
                "jquery-ui": "jquery-ui-1.11.0.custom.min",
                "jquery.ui": "jquery-ui",
                "jquery.mousewheel": "jquery.mousewheel.min",
                "globalize": "globalize.min"
            }
    });
</script>

<script id="scriptInit" type="text/javascript">
    require(["wijmo.wijeditor"], function () {
        $(document).ready(function () {
            $("#wijeditor").wijeditor();
        });
    });
</script>

The markup and script featured here results in the following live widget. You can edit the text in the editor.