развернуть / свернуть панель zk с помощью JavaScript - PullRequest
Новая
       18

развернуть / свернуть панель zk с помощью JavaScript

2 голосов
/ 05 декабря 2011

Я хочу щелкнуть на границе ZK (складной «Восток» ИЛИ «Север» ИЛИ ...), чтобы временно открыть ее с помощью JavaScript. что мне делать?

спасибо заранее друзья.

UPDATE:

Когда оно закрыто, щелкнув по закрытой границе область (не на Open ICON ) (посмотрите на позицию курсора на рисунке) он будет временно открыт. Я хочу закрытый borderLayout и открыть его вот так, с помощью javascript / jquery.

картинка: enter image description here

Ответы [ 2 ]

2 голосов
/ 20 декабря 2011

1. Получите виджет из движка клиента ZK.

2.call setOpen (true) или setOpen (false)

Вот пример для этого, а также вы можете протестировать его на платформе ZK fiddle.

http://zkfiddle.org/sample/bk3jop/1-Close-border-layout-panel-by-javascript

<zk xmlns:w="client">

  <script>
    function closeNorth(){
      var widget = zk.Widget.$("$mynorth"); //Using the pattern for $ + ID to select a ZK widget. 
      widget.setOpen(false);

    }
    function openNorth(){
      var widget = zk.Widget.$("$mynorth"); //Using the pattern for $ + ID to select a ZK widget. 
      widget.setOpen(true);

    }    
  </script>
  <button label="click me to close it" w:onClick="closeNorth();" />          
  <button label="click me to open it" w:onClick="openNorth();"  />    

  <borderlayout >
    <north id="mynorth" title="North" maxsize="300" size="50%" splittable="true" collapsible="true">
          <div>
           Test .... <textbox />
          </div>
    </north>
  </borderlayout>

</zk>
1 голос
/ 06 января 2012

Для вашей цели, здесь я приведу еще один пример для этого.http://zkfiddle.org/sample/bk3jop/2-Close-border-layout-panel-by-javascript

<script>
    function openNorth(){
      var widget = zk.Widget.$("$mynorth"); //Using the pattern for $ + ID to select a ZK widget. 

       if(!widget.isOpen()){
         try{
           widget.doClick_({
             domTarget:widget.$n('colled')  
           });
         }catch(e){ //ignore unhandled exception.
         }
       }

    }    
  </script>

В любом случае, это больше похоже на взлом.

Для более подробной информации вы можете обратиться к https://github.com/zkoss/zk/blob/master/zul/src/archive/web/js/zul/layout/LayoutRegion.js

doClick_: function (evt) {
        var target = evt.domTarget;
        switch (target) {
        case this.$n('btn'):
        case this.$n('btned'):
        case this.$n('splitbtn'):
            if (this._isSlide || zk.animating()) return;
            if (this.$n('btned') == target) {
                var s = this.$n('real').style;
                s.visibility = "hidden";
                s.display = "";
                this._syncSize(true);
                s.visibility = "";
                s.display = "none";
            }
            this.setOpen(!this._open);
            break;
        case this.$n('colled'):                 
            if (this._isSlide) return;
            this._isSlide = true;
            var real = this.$n('real'),
                s = real.style;
            s.visibility = "hidden";
            s.display = "";
            this._syncSize();
            this._original = [s.left, s.top];
            this._alignTo();
            s.zIndex = 100;

            if (this.$n('btn'))
                this.$n('btn').style.display = "none"; 
            s.visibility = "";
            s.display = "none";
            zk(real).slideDown(this, {
                anchor: this.sanchor,
                afterAnima: this.$class.afterSlideDown
            });
            break;
        }
        this.$supers('doClick_', arguments);        
    },
...