1

I'm trying to build a custom widget called Staticblock. I want to use the Resizable widget as the prototype. I thought a widget could be inherited and if no changes were made to the sub widget (no methods add or overridden) it would behave like the inherited widget(Resizable).

$.widget( "my.staticblock", $.ui.resizable, {
    /*
      methods go here
    */
});

Now, shouldn't I be able to use "staticblock" as if it were "resizable". Like so...

$( "#resizable1").staticblock();

Ok, that works but if I pass an option I get an error. Like so..

$( "#resizable1").staticblock({
    containment: "parent"
});

containment: "parent" is a valid option for the Resizable widget. The below works fine..

$( "#resizable1").resizable({
    containment: "parent"
});

The error I get is related to this chunk of code in the jQuery UI.

 $.ui.plugin.add("resizable", "containment", {

start: function() {
    var element, p, co, ch, cw, width, height,
        that = $(this).data("ui-resizable"),
        o = that.options,
        el = that.element,
        oc = o.containment,
        ce = (oc instanceof $) ? oc.get(0) : (/parent/.test(oc)) ?    
                    el.parent().get(0) : oc;

    if (!ce) {
        return;
    } ...

In my humble attempt to figure it out I was able to determine that when using the
staticblock widget "that" is undefined on execution of the line 

that = $(this).data("ui-resizable").

What am I doing wrong ? Thank you.

4

0 回答 0