jLayout with marionette.js

[nadvi]

As-salamu-alikum

Zazakallah khair for showing interest on my issue.

I am novice to programming and weak in javascript but I like the border layout and this work is fantastic.In blog\assets\js\app\view\bdrbapView.js my code is as follows

define(["require", "jq", "jqui", "jqs", "jlb", "jl", "mt"],
    function (require, jq, jqui, jqs, jlb, jl, mt) {
        var Mn = require('mt');
        return Mn.View.extend({
            onAttach: function (options) {
                jQuery(function ($) {

                    var container = $('#layout');

                    function layout() {
                        container.layout({
                            resize: false,
                            type: 'border',
                            vgap: 1,
                            hgap: 1
                        });
                    };

                    $('.east')
                        .resizable({
                            handles: 'w',
                            stop: layout,
                            resize: layout
                        });

                    $('.west')
                        .resizable({
                            handles: 'e',
                            stop: layout,
                            resize: layout
                        })

                    $(window)
                        .resize(layout);

                    layout();
                    layout();
                });
            },
            onRender: function (options) {
                // this.showChildView('content', new contentView());
                // this.showChildView('footer', new footerView());
                // this.showChildView('util', new utilView());
            }
        });
    });

But I am facing a strange problem.The code does not produce expected result.The code is attached here.
Please help me.I will be grateful to you.

Zazakallah khair for reading my post.

Allah-hafiz

Nadvi