Hi, The getting started doc mentions that one can extend this static class - I know there is DayView behaviour "quarterMinutes" what about an interval every ten mins?
thanks.
Support Forum
Okay, should have searched first - based on previous posts....
How would I apply:
It doesn't seem to work in an Ext.Apply/override block.
Also I have the same problem with the width and no horizontal scroll bar, I tried to add this to by EditorPanel:
But an error is thrown in firebug:
Any thoughts?
Thanks!
How would I apply:
Sch.ColumnFactory.defaults.width = 50;
Also I have the same problem with the width and no horizontal scroll bar, I tried to add this to by EditorPanel:
view: new Sch.LockingGroupingSchedulerView({
showGroupName : false,
hideGroupedColumn : true
}),
- this.cm.getTotalLockedWidth is not a function
[Break on this error] var _0xd396=["\x43\x2E\x31\x49\x28\x27...396[3][_0xd396[2]](_0xd396[1]),0,{}));
var x = new Sch.EditorSchedulerPanel({
autoWidth:true,
height:400,
renderTo : Ext.getBody(),
clicksToEdit : 1,
view: new Sch.LockingGroupingSchedulerView({
showGroupName : false,
hideGroupedColumn : true
}),
columns : [
{header : 'Staff', sortable:true, width:130, dataIndex : 'Name', editor : new Ext.form.TextField()},
{header : 'Type', sortable:true, width:140, dataIndex : 'Type', editor : new Ext.form.ComboBox({
store: ['Sales', 'Optom', 'Dispensing', 'Receptionist'],
typeAhead: true,
forceSelection: true,
triggerAction: 'all',
selectOnFocus:true
})}
],
// Setup view configuration
viewModel : {
start : start,
end : start.add(Date.HOUR, 10),
columnType : 'quarterMinutes2',
viewBehaviour : Sch.ViewBehaviour.HourView,
renderer : renderer
},
// Specialized template with header and footer
eventTemplate : new Ext.Template(
'<div id="{id}" style="width:{width}px;left:{leftOffset}px" class="sch-event {cls}">' +
'<div class="sch-event-inner">' +
'<span class="sch-event-header">{headerText}</span>' +
'<div class="sch-event-footer">{footerText}</div>' +
'</div>' +
String.format(Sch.SchedulerPanel.prototype.resizeHandleHtml, 'east'),
'</div>').compile(),
viewConfig: {
forceFit:true
},
store : resourceStore,
eventStore : eventStore,
border : true,
tbar : [
{
iconCls : 'icon-prev',
scale : 'medium',
handler : function() {
var start = x.getStart(), end=x.getEnd();
if (Ext.getCmp('span3').pressed) {
start = start.add(Date.WEEK, -6);
end = end.add(Date.WEEK, -6);
} else {
var days = Math.max(Date.getDurationInDays(start, end), 1);
start = start.add(Date.DAY, -days);
end = end.add(Date.DAY, -days);
}
x.setView(start, end);
}
},
{
id : 'span0',
pressed: true,
enableToggle : true,
toggleGroup: 'span',
inputValue: 'red',
text : '15 minutes',
handler : function() {
var s = x.getStart();
s.clearTime();
s.setHours(9);
var e = s.add(Date.HOUR, 10);
x.setView(s, e, 'quarterMinutes2', Sch.ViewBehaviour.HourView, this.renderer);
}
},
{
id : 'span1',
pressed: false,
text: '1 Day',
enableToggle : true,
toggleGroup: 'span',
inputValue: 'red',
handler : function() {
var start = x.getStart();
start.clearTime();
start.setHours(9);
x.setView(start, start.add(Date.HOUR, 10), 'hourAndDay', Sch.ViewBehaviour.HourView, this.renderer);
}
},
' ',
{
id : 'span2',
enableToggle : true,
text: '1 week',
toggleGroup: 'span',
handler : function() {
x.setView(x.getStart(), x.getStart().add(Date.DAY, 7), 'dayAndWeeks', Sch.ViewBehaviour.DayView, this.renderer);
}
},
' ',
{
id : 'span3',
enableToggle : true,
text: '6 weeks',
toggleGroup: 'span',
handler : function() {
x.setView(x.getStart(), x.getStart().add(Date.DAY, 42), 'weekAndMonths', Sch.ViewBehaviour.MonthView, this.renderer);
}
},
'->',
{
iconCls : 'icon-cleardatabase',
tooltip: 'Clear database',
scale : 'medium',
handler : function() {
x.eventStore.removeAll();
}
},
{
iconCls : 'icon-next',
scale : 'medium',
handler : function() {
var start = x.getStart(), end=x.getEnd();
if (Ext.getCmp('span3').pressed) {
start = start.add(Date.WEEK, 6);
end = end.add(Date.WEEK, 6);
} else {
var days = Math.max(Date.getDurationInDays(start, end), 1);
start = start.add(Date.DAY, days);
end = end.add(Date.DAY, days);
}
x.setView(start,end);
}
}
],
tooltipTpl : new Ext.XTemplate(
'<dl class="eventTip">',
'<dt class="icon-clock">Time</dt><dd>{[values.StartDate.format("Y-m-d G:i")]}</dd>',
'<dt class="icon-task">Task</dt><dd>{Title}</dd>',
'<dt class="icon-earth">Location</dt><dd>{Location} </dd>',
'</dl>').compile(),
plugins : [ editor ],
listeners : {
dragcreateend : {
fn : function(p, data, e) {
var newRec = new eventStore.recordType({
Title: 'New task',
ResourceId : data.record.get('Id'),
Location : 'Local office',
StartDate : data.startDate,
EndDate : data.endDate
});
eventStore.add(newRec);
// Enter edit mode right away
editor.show(newRec);
},
scope : this
}
},
trackMouseOver : false
});
Any thoughts?
Thanks!
To use the scrollable Locking View, you need to use a special column model too. See the code in the example http://ext-scheduler.com/examples/local/local.js
Does that get it working?
// Setup your static columns
colModel : new Ext.ux.grid.LockingColumnModel({
columns : [
{header : 'Machines', sortable:true, width:140, dataIndex : 'Name', locked:true, renderer : function(v, m, r) {
m.css = r.get('Category');
return v;
}}
]
}),
Sounds like you're using a GroupingView with a regular store. Such a view requires a groupingstore, see the locking-grouping example: http://ext-scheduler.com/examples/locki ... rouping.js
var resourceStore = new Ext.data.GroupingStore({
groupField : 'Category',
sortInfo:{field: 'Id', direction: "ASC"},
reader : new Ext.data.JsonReader({
idProperty : 'Id'
}, [
'Id',
'Category',
'Name'
]
),
data : data
});
Are you including
<link href="https://extjs.cachefly.net/ext-3.1.1/exa ... idView.css" rel="stylesheet" type="text/css" />
?
<link href="https://extjs.cachefly.net/ext-3.1.1/exa ... idView.css" rel="stylesheet" type="text/css" />
?