Warning: Can't synchronize with repository "(default)" (Unsupported version control system "svn": No module named svn). Look in the Trac log for more information.

Ticket #1297 (closed defect: worksforme)

Opened 5 years ago

Last modified 4 years ago

Using Tabber widget results in <style> being dumped into <body> instead of <head>

Reported by: anseljh Owned by: anonymous
Priority: normal Milestone: 1.0.2
Component: TG Widgets Version: 1.0.1
Severity: normal Keywords: tabber widget
Cc:

Description

I am trying to use the Tabber widget. This is in one of my controllers:

  tabberWidget = widgets.Tabber()
  return dict(last_ten=last_ten, case_types=case_types, tabber=tabberWidget)

See the attached screenshot of Firebug - it shows that Tabber's JavaScript? has executed, and resulted in a <style> tag being put as the first element of the <body> -- which is invalid; <style> can only go in <head>. This also means the <style> tag shows up on my page -- ugly! :)

Attachments

firebug.png Download (82.0 KB) - added by anseljh 5 years ago.
Screenshot of Firebug showing <style> tag in <body> instead of <head>
top-of-page.png Download (3.4 KB) - added by anseljh 5 years ago.
[Cropped] screenshot of top of the page, showing <script> tag
barelyfitz.png Download (161.7 KB) - added by anseljh 5 years ago.
Firebug screenshot of  http://www.barelyfitz.com/projects/tabber/ - shows proper placement of <script> tag in <head>
html.png Download (30.6 KB) - added by anseljh 5 years ago.
Firebug screenshot of DOM with HTML
xhtml.png Download (47.5 KB) - added by anseljh 5 years ago.
Firebug screenshot of DOM with XHTML
Picture 1.png Download (91.1 KB) - added by alberto 5 years ago.

Change History

Changed 5 years ago by anseljh

Screenshot of Firebug showing <style> tag in <body> instead of <head>

Changed 5 years ago by anseljh

[Cropped] screenshot of top of the page, showing <script> tag

comment:1 Changed 5 years ago by anseljh

As a side note, the Tabber didn't work either - I just got three <div class="tabbertab">'s displayed one after the other. I plugged in MochiKit? 1.4 manually, and now the Tabber works -- but I still see the <style> tag on my page. Weird!

Changed 5 years ago by anseljh

Firebug screenshot of  http://www.barelyfitz.com/projects/tabber/ - shows proper placement of <script> tag in <head>

comment:2 follow-up: ↓ 3 Changed 5 years ago by jorge.vargas

what exactly do you mean by didn't work? I see it working on the toolbox maybe checking out how it is done there you can make it work tags/1.0.1/turbogears/toolbox/base.py tags/1.0.1/turbogears/toolbox/widgets.kid

comment:3 in reply to: ↑ 2 Changed 5 years ago by anseljh

Thanks, Jorge - I will try it in the next couple of days.

comment:4 Changed 5 years ago by khorn

anseljh- If you still have problems, try to narrow things down to a simple test case, or failing that, at least post some of your code and/or the output of "tg-admin info" so we can get a better idea of what is going on.

Thanks.

Changed 5 years ago by anseljh

Firebug screenshot of DOM with HTML

Changed 5 years ago by anseljh

Firebug screenshot of DOM with XHTML

comment:5 Changed 5 years ago by anseljh

Some updates:

  • I upgraded TG to 1.0.1, and got the same results as before, so I'm updating the version of this but to 1.0.1.
  • In app.cfg, I tried switching from kid.outputformat="xhtml-strict" to kid.outputformat="html". The result? It works properly, i.e. it puts the <style> tag in the <head> instead of the <body>.

So, for some reason, if you serialize your output as XHTML, the Tabber widget puts its style in the <body> instead of the <head>.

comment:6 Changed 5 years ago by anseljh

  • Version changed from 1.0b2 to 1.0.1

comment:7 Changed 5 years ago by anseljh

Here's my tg-admin info output:

TurboGears Complete Version Information

TurboGears requires:

* TurboGears 1.0.1
* configobj 4.3.2
* RuleDispatch 0.5a0.dev-r2115
* setuptools 0.6c5
* FormEncode 0.5.1
* cElementTree 1.0.5-20051216
* PasteScript 0.9.7
* elementtree 1.2.6
* simplejson 1.3
* CherryPy 2.2.1
* TurboKid 0.9.8
* TurboCheetah 0.9.5
* TurboJson 0.9.9
* PyProtocols 1.0a0dev-r2082
* Cheetah 1.0
* PasteDeploy 0.9.6
* Paste 0.9.7
* kid 0.9.3
* Cheetah 1.0
* elementtree 1.2.6

Identity Providers 

* sqlobject (TurboGears 1.0.1)
* sqlalchemy (TurboGears 1.0.1)

tg-admin Commands 

* info (TurboGears 1.0.1)
* shell (TurboGears 1.0.1)
* quickstart (TurboGears 1.0.1)
* update (TurboGears 1.0.1)
* sql (TurboGears 1.0.1)
* i18n (TurboGears 1.0.1)
* toolbox (TurboGears 1.0.1)

Visit Managers 

* sqlobject (TurboGears 1.0.1)
* sqlalchemy (TurboGears 1.0.1)

Template Engines 

* kid (TurboKid 0.9.8)
* cheetah (TurboCheetah 0.9.5)
* json (TurboJson 0.9.9)

Widget Packages 


TurboGears Extensions 

* visit (TurboGears 1.0.1)
* identity (TurboGears 1.0.1)

comment:8 follow-up: ↓ 9 Changed 5 years ago by alberto

  • Status changed from new to closed
  • Resolution set to worksforme

Can't repproduce this problem with a quickstarted app, modified controllers.py to look like:

from turbogears import controllers, expose, flash, widgets
# from model import *
# import logging
# log = logging.getLogger("foolan.controllers")

tabber = widgets.Tabber()

class Root(controllers.RootController):
    @expose(template="foolan.templates.welcome")
    def index(self):
        import time
        # log.debug("Happy TurboGears Controller Responding For Duty")
        flash("Your application is now running")
        return dict(now=time.ctime(), tabber=tabber)

And firebug shows the attached DOM tree.

Alberto

Changed 5 years ago by alberto

comment:9 in reply to: ↑ 8 Changed 5 years ago by joshua

Same thing here, what works for me ist passing hide_on_load=False to the Tabber's constructor.

Note: See TracTickets for help on using tickets.