Require.js

HTML

<script src="https://rawgithub.com/rniemeyer/knockout-amd-helpers/master/ext/require/require.js"></script>
<section data-bind="module: 'viewArticle'">
    <div data-bind="ifnot: creatingNewArticleType">
        <div data-bind="visible: creatingNewArticleType() === false" style="display: none">
             <h1>View Article</h1>

            <div data-bind="text: new Date()"></div>
            <p>
                <input data-bind="value: name"></input>
            </p>
            <p>
                <select data-bind="options: articleTypes, optionsText: 'articleType', optionsValue: 'id', value: selectedArticleType, optionsCaption: 'Choose...'"></select> <a href="#" data-bind="click: createNewArticleType">Create New Article Type</a>

            </p>
        </div>
    </div>
</section>
<section data-bind="module: 'viewArticleType'">
    <div data-bind="if: createintNewArticleType">
        <div data-bind="visible: createintNewArticleType() === true" style="display: none">
             <h1>Create New Article Type</h1>

            <div data-bind="text: new Date()"></div>
            <input data-bind="value: typeName"></input>
            <br/>
            <input data-bind="value: typeDescription"></input>
            <p> <a href="#" data-bind="click: createdNewArticleType">Create New Article Type</a>

            </p>
        </div>
    </div>
</section>

JavaScript

define("article", ["knockout", "jquery", "knockout-postbox"], function(ko, $) {
                var Article = function() {
                    var self = this;

                    self.name = ko.observable();
                    self.selectedArticleType = ko.observable();
                    self.articleTypes = ko.observableArray();
                    self.creatingNewArticleType = ko.observable(false).syncWith("createArticleType");

                    self.createNewArticleType = function () {
                        self.creatingNewArticleType(true);
                    };

                    self.initialize = function () {
                        self.name("This is a sample article");
                        self.getArticleTypes(self.articleTypes);
                    };

                    self.getArticleTypes = function (observableArticleTypes) {
                        var fakeData = {
                            delay: 5
                        };
                        $.ajax({
                            async: true,
                            cache: false,
                            type: 'post',
                            url: '/echo/json/',
                            data: fakeData,
                            success: function (data) {
                                observableArticleTypes([{
                                    id: 1,
                                    articleType: 'Breaking News'
                                }, {
                                    id: 2,
                                    articleType: 'Weather'
                                }]);

                                console.log("Data loaded from server");

                            }
                        });
                    };


                    return {
                        name: self.name,
                        selectedArticleType: self.selectedArticleType,
                        createNewArticleType: self.createNewArticleType,
       ...