Javascript Templates

jquery-widget

basic-jquery-widget.tpl

define([
    'jquery'
], function ($) {
    'use strict';

    $.widget('{{widget_name}}', {
        /**
         * Default options
         */
        options: {

        },

        /**
         * Creates and initializes widget
         * @private
         */
        _create: function() {

        },
    });

    return $.{{widget_name}};
})

jquery-widget-with-ajax-get.tpl

define([
    'jquery'
], function ($) {
    'use strict';

    $.widget('{{widget_name}}', {
        /**
         * Default options
         */
        options: {
            ajaxGetUrl: null,
        },

        /**
         * Creates and initializes widget
         * @private
         */
        _create: function() {

        },

        /**
         * @private
         */
        _ajaxGetRequest: function () {
            const self = this;
            $.ajax({
                url: self.options.ajaxGetUrl
            }).success(function(response){

            })
        }
    });

    return $.{{widget_name}};
})

jquery-widget-with-ajax-post.tpl

define([
    'jquery'
], function ($) {
    'use strict';

    $.widget('{{widget_name}}', {
        /**
         * Default options
         */
        options: {
            ajaxPostUrl: null,
        },

        /**
         * Creates and initializes widget
         * @private
         */
        _create: function() {

        },

        /**
         * @private
         */
        _ajaxPostRequest: function () {
            const self = this;
            $.ajax({
                url: self.options.ajaxPostUrl,
                method: 'post',
                data: { }
            }).success(function(response){

            })
        }
    });

    return $.{{widget_name}};
})

jquery-widget-with-storage-post.tpl

define([
    'jquery',
    'mage/storage'
], function ($, storage) {
    'use strict';

    $.widget('{{widget_name}}', {
        /**
         * Default options
         */
        options: {
            storagePostUrl: null,
        },

        /**
         * Creates and initializes widget
         * @private
         */
        _create: function() {

        },

        /**
         * @private
         */
        _storagePostRequest: function () {
            const self = this;
            let data = { };
            storage.post(self.options.storagePostUrl, JSON.stringify(data), true)
                .done(response => {

                })
                .complete(() => {

                })
                .fail(() => {

                });
        }
    });

    return $.{{widget_name}};
})