Issues

ZF-5666: jQuery UI TabContainer rendering incorrectly

Description

There's a bug in the jQuery UI TabContainer helper that makes the tabs not render correctly.

Screenshot of tabs: !http://freeimagehosting.net/uploads/…! www.freeimagehosting.net/image.php?5a232fe8db.png" rel="nofollow">Full Size

The problem is the addition of child element in the javascript function, as shown in the below diff that fixed the problem.


// Diff output
122c122
<         $js = sprintf('%s("#%s > ul").tabs(%s);',
---
>         $js = sprintf('%s("#%s").tabs(%s);',

Screenshot after diff: !http://freeimagehosting.net/uploads/…! www.freeimagehosting.net/image.php?aaa4bd0ecb.png" rel="nofollow">Full Size

Comments

Changed assignment to me.

Hello Brian,

can you tell me the jQuery UI Version that you are using?

Schedulded for the next release (Either 1.8 or 1.7.5)

Hi, I am trying to get this component working for subforms and mine does not display with tabs.

It does work with the following diff (and without the diff noted previously):

93c93 < $list = '

<

ul class="ui-tabs-nav">'.PHP_EOL;

       $list = '
  • '.PHP_EOL; 133c133 < . '

'.PHP_EOL;

         . '</div></div>'.PHP_EOL;

I am using the following JQuery includes:

The screenshots look like they were taken from the example at http://zendframework.com/manual/en/…

I was trying to get that example working before implementing with my own forms and am wondering if the rest of the example is available somewhere (headers, javascript, css stylesheet).

@Laura: which UI version and which stylesheet are you using?

Here are the contents of my jquerytest.phtml (jquerytestAction in the controller is taken directly from http://zendframework.com/manual/en/…):


jQuery UI Tabs - Default functionality

<?=$this->form ?>

I did also try adding this line with same functional results (different styling):

ZendX is from the Zend 1.7.4 release.

(Sorry for the slow replay, was expecting the issue tracker to email me... will have to look for that setting...)

Okay, I get it... should have been $("#tabContainer").tabs() in the javascript...

I still think it would be useful to add this to the example, along with the javascript and stylesheet includes.