How can widget.bridge connect a jquery jquery-ui?

Question

I want to upgrade jQuery and jQuery UI's version in my project

but tabs widget has problem.

active event is not working

so i want fix it and know what is wrong

how does $("tabs").tabs("option", "active", tab_index) move to function $.widget.bridge ?????

and i wonder how widget.birdge works

here is my code

    v_Tabs.obj
        = $("tabs").tabs({

            activate: function (event, ui) {
                gw_com_api.hide("lyrAdd");
                var page = "page_" + v_Tab.index;
                                    var content =
                    "<iframe" +
                        " id='" + page + "'" +
                        " src='" + v_Tab.content +
                        "?USR_ID=" + v_Session.USR_ID +
                        "'" +
                        " width='100%'" +
                        " height='550px'" +
                        " frameborder='yes' scrolling='no' marginheight=0 marginwidth=0" +
                    ">" +
                    "</iframe>";
                $(ui.panel).append(content);
            }
        });

    v_Tabs.obj.tabs("option", "active", tab_index);

When you use $(ui.panel).append(content);, ui.panel does not exist. You can use: ui.newTab, ui.oldTab, ui.newPanel, ui.oldPanel in activate. — Twisty
– Twisty, Commented Aug 4, 2016 at 16:22
Also $("tabs").tabs() is not a valid selector. I would advise $("#tabs").tabs();. — Twisty
– Twisty, Commented Aug 4, 2016 at 16:25
thanks for your comment i replaced 'ui.panel' with' ui.newPanel' and my selector is correct, but when I click my tab , do not change anything...what is problem and do where to look to find the wrong????? — Hee
– Hee, Commented Aug 5, 2016 at 1:10

Twisty · Accepted Answer · 2016-08-04 16:33:45Z

0

A few small fixes should get you on your way.

jQuery

v_Tabs.obj = $("#tabs").tabs({
  activate: function(event, ui) {
    gw_com_api.hide("lyrAdd");
    var page = "page_" + v_Tab.index;
    var content = $("<iframe>", {
      id: page,
      src: v_Tab.content + "?USER_ID=" + v_Session.USR_ID,
      width: '100%',
      height: '550px',
      frameborder: 'yes',
      scrolling: 'no',
      marginheight: 0,
      marginwidth: 0
    });
    $(ui.newPanel).append(content);
  }
});

Example: https://jsfiddle.net/Twisty/ygb0o68b/

I suspect you need ui.newPanel to contain the iframe. Using jQuery to create the element gives you a nicer degree of control. You also have to make sure your selector is correct.

answered Aug 4, 2016 at 16:33

Twisty

31k2 gold badges30 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can widget.bridge connect a jquery jquery-ui?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related