jquery - FullCalendar AllDaySlot replacement -


i'm using fc in webapp plan employeeshifts. users add slot , assign 1 or several employees slot (or themself). works charm.

now i've been asked new feature - "counter" placed in top of each day (basicweek,agendaweek,agendaday should have this).

this counter should show how many hours have been planned date , other similar information.

my problem how either add new tr in thead - 1 each day - or use alldayslot visually be. add menu top of each day in agendaweek andbasicweek using code below, i've tried add placeholder in loop, no luck.

looking forward intelligent input on :d

if (view.name === 'agendaweek' || view.name === 'basicweek') {                 // add "dropdowns" day headers                 var $headers = $('.fc-widget-header.fc-sun, .fc-widget-header.fc-mon, .fc-widget-header.fc-tue, .fc-widget-header.fc-wed, .fc-widget-header.fc-thu, .fc-widget-header.fc-fri, .fc-widget-header.fc-sat, .fc-day-header.fc-sun, .fc-day-header.fc-mon, .fc-day-header.fc-tue, .fc-day-header.fc-wed, .fc-day-header.fc-thu, .fc-day-header.fc-fri, .fc-day-header.fc-sat');                 $headers.css('position', 'relative');                 $headers.each(                     function(){                         var _d = $(this).html().substring(4);                         $(this).prepend("<div class='topdropdown' style='position: absolute; left: 0;' onmouseover='showdaymenu(\""+ _d +"\",this);'><span class='icon12 icomoon-icon-grid-view-2'></span></div>");                         var _date = $(this).attr("class").match("fc-col[0-9]"));                         //$(this).parent().find(".fc-widget-content").html("<div class='topcounter' style='position: absolute; left: 0;'>"+ _date +"</div>");                     }                 );             } 

edit 2013-08-14: tried add new tr thead , result was... not quite expected :) added new tr thead , inserted orange bordered div placeholder, rows below didn't "move down" - forced alter css fc ? http://img5.imageshack.us/img5/7743/31fv.png

really hope 1 of guys have answer :?

best regards,mark

this isn't direct answer question, rather work-around used accomplish same task:

in case, returned json array of elements wanted add fullcalendar start time end time title etc, needed daily hour values @ top (in day slot preferrable).

i iterated through each day within month range , added new array object event object total hours day , start time along common attribute distinguish these daily counters such vs. actual event.

when rendering events calendar, set allday true along locking them up, e.g:

{ 'title': item.summary, 'start': item.start, 'allday': true,'starteditable': false, 'description': 'counter' }

the item.summary string hour count server ("hrs: [#]").

item.start set midnight on day of counter.

this makes them non-draggable, small, , @ top of each day (regardless of view, naturally). populate array object these counter objects first ensure rendered @ top of page.

again, doesn't directly address question, allow result you're looking for.

(i spent couple of hours getting figured out/set - first stack overflow post!)


Comments

Popular posts from this blog

ios - UICollectionView Self Sizing Cells with Auto Layout -

node.js - ldapjs - write after end error -

DOM Manipulation in Wordpress (and elsewhere) using php -