[web2py] Re: jQuery UI tabs selected tab.

[annet]

Hi Richard,

Thanks for your reply. I tried in web2py_ajax.html:

script type=text/javascript
  $(function(){
// Tabs
$('#tabs').tabs();
$(.selector).tabs({selected: 3});
  });
/script

(for convenience I used the constant 3) ... and in the view I tried:

script type=text/javascript
 var actual_day = {{=weekday}}
 $(.selector).tabs(option, selected, actual_day );
/script

Neither of these solutions work. Do you have any idea why not?


Hi Cliff,

Thanks for your reply.

 You need landing areas for your data.

That's what I thought, however, from the ajax example I learned I
somehow don't need them. The plugin creates landing areas for every
tab with the id set to: id=ui-tabs-1, id=ui-tabs-2 etc.

Which in my case is quite convenient for all tabs but the last have
the same content: class times for a specific day. So the controller
and the view are rather simple:

rows=db((db.lesrooster.bedrijf_id==1)(db.lesrooster.dag_id==request.args(0))).select(db.lesrooster.ALL,orderby=db.lesrooster.tijd)

and the view a table with class times.


 Also note you don't need to use line continuation inside a tuple,
 list, or dictionary.

 URL doesn't need the list delimiters if there's only one arg.

Thanks, I removed them all.


Kind regards,

Annet.

[web2py] Re: jQuery UI tabs selected tab.

[Cliff]

Haven't tried Richard's way, but here is how I do it.

You need landing areas for your data.
Something like this:

div id=tabsul
lia href={{=URL('classtimes',args='tab_1')}}Monday/a/
li
 lia href={{=URL('classtimes',args='tab_2')}}Tuesday/
a/
li
 lia href={{=URL('classtimes',args='tab_3')}}Wednesday/
a/
li
 lia href={{=URL('classtimes',args='tab_4')}}Thursday/
a/
li
 lia href={{=URL('classtimes',args='tab_5')}}Friday/a/
li
  lia href={{=URL('classtimes',args='tab_6')}}Saturday/
a/
li
  lia href={{=URL('classtimes',args='tab_7')}}Sunday/
a/
li
   lia href={{=URL('classtimes',args=['week'])}}Week/
a/li
 /ul
/div!--tabs--
div id=tab_1
{{=stuff_to_go_on_tab_1}}
/div
div id=tab_2
{{=stuff_to_go_on_tab_2}}
/div
.
.
.

In the controller:

def function_associated_with_the_view():

## get records for tab 1 from the db
## build the table of info for tab 1
stuff_to_go_on_tab_1 = TABLE(...yada, yada) # or whatever


## get records for tab  from the db
## build the table of info for tab 2
stuff_to_go_on_tab_2 = TABLE(...yada, yada)

...

return dict(
stuff_to_go_on_tab_1=stuff_to_go_on_tab_1,
stuff_to_go_on_tab_2=stuff_to_go_on_tab_2,
...
)

Also note you don't need to use line continuation inside a tuple,
list, or dictionary.

URL doesn't need the list delimiters if there's only one arg.


On Oct 21, 1:12 pm, Richard Vézina ml.richard.vez...@gmail.com
wrote:
 Here the api of tabs plugin :

 selected http://jqueryui.com/demos/tabs/#option-selectedNumberDefault:0

 Zero-based index of the tab to be selected on initialization. To set all
 tabs to unselected pass -1 as value.
 Code examplesInitialize a tabs with the selected option specified.

 $( .selector ).tabs({ selected: 3 });

 Get or set the selected option, after init.

 //getter
 var selected = $( .selector ).tabs( option, selected );
 //setter
 $( .selector ).tabs( option, selected, 3 );

 I think you only have to pass the actual weekday as a selected value of you
 tabs init code...

 You can do this like that :

     var actual_day = {{=actual_weekday_passed_from_web2py_controller}}

 $( .selector ).tabs( option, selected, actual_day );

 I didn't test any thing... But, I guest it should works...

 Richard







 On Fri, Oct 21, 2011 at 12:51 PM, annet annet.verm...@gmail.com wrote:
  I am working on a timetable app using jQuery UI tab.

  This is the timetable view:

  !-- Tabs --
   h2 class=demoHeadersLesrooster/h2
    div id=tabs
       ul
         lia href={{=URL('classtimes',args=[1])}}Monday/a/li
          lia href={{=URL('classtimes',args=[2])}}Tuesday/a/
  li
          lia href={{=URL('classtimes',args=[3])}}Wednesday/a/
  li
          lia href={{=URL('classtimes',args=[4])}}Thursday/a/
  li
          lia href={{=URL('classtimes',args=[5])}}Friday/a/li
           lia href={{=URL('classtimes',args=[6])}}Saturday/a/
  li
           lia href={{=URL('classtimes',args=[7])}}Sunday/a/
  li
            lia href={{=URL('classtimes',args=['week'])}}Week/
  a/li
          /ul
     /div !-- tabs --

  This the controller:

  def timetable():
     return dict()

  def classtimes():
     if request.args(0)=='week':
         weekday='all'
         rows=db(db.lesrooster.bedrijf_id==1).select(db.lesrooster.ALL,
  \
  orderby=db.lesrooster.dag_id|db.lesrooster.tijd)
     else:
         weekday=[]

  rows=db((db.lesrooster.bedrijf_id==1)(db.lesrooster.dag_id==request.args(0 
  ))).select(db.lesrooster.ALL
  \
  ,orderby=db.lesrooster.tijd)
     return dict(rows=rows)

  The classtimes view is a table based view.

  This all works, what I don't get to work is the selected tab being
  today's tab, i.e. when today is Friday, Friday's classes should be
  displayed in the Friday tab.

  I hope one of you will be able to help me solve this problem.

  Kind regards,

  Annet