I have a view called timelineFourMonths and I need them to stay permanent. jan-apr, may-august, sept-dec. At the moment, when i am looking at february in the month view and switch to 4 month view, it will show me feb-may but i would need the calendar to switch to jan-apr.
i tried this:
defaultView: Cookies.get('fullCalendarCurrentView') || 'timelineMonth',
defaultDate: Cookies.get('fullCalendarCurrentDate') || null,
/* viewRender: function(view) {
Cookies.set('fullCalendarCurrentView', view.name, {path: ''});
Cookies.set('fullCalendarCurrentDate', view.intervalStart.format(), {path: ''});
Cookies.set('fullCalendarStart', view.intervalStart.format(), {path: ''});
},
*/
viewRender: function(view){if (view.name=='timelineFourMonths')
{ $('#calendar').fullCalendar('gotoDate', moment('2017-01-01'));} else {
Cookies.set('fullCalendarCurrentView', view.name, {path: ''});
Cookies.set('fullCalendarCurrentDate', view.intervalStart.format(), {path: ''});
Cookies.set('fullCalendarStart', view.intervalStart.format(), {path: ''});
}
},
i am using cookies to preserve current view and date on refresh. default code is commented out at the moment and i tried the if function. it works, i will figure something out to find out the current 4month period from current date but this is not the best solution because it doesn't let me navigate on the 4 month periods. it will always go back to the date set by 'gotoDate'.
defaultDate did not work in view settings even if i disabled the cookies settings.
Related
I am currently working on a project for my company, where I need to plot highstock charts, which show energy-data of our main buildings.
Since it is live data, new datapoints come per Websocket every few-or-so seconds. However, the graph should only show one datapoint every hour. I wanted to clear this with the highstock dataGrouping, but it does not really work. It groups the points yes, but it still shows the „transmission“, the graph-line, between them. Thus making the whole graph completely irreadable.
In an other Version of the project, the graph only shows the latest datapoint of each group (as specified in the „approximate“ object in the chart options), but also does not start a new group after the chosen Interval runs through.
I've been sitting on this problem for about 3 days now and have not found any proper completely working solution yet.
Unfortunately, due company policy and due to hooks and components necessary, which are only used here in the company, I'm not able to give you a jsfilddle or similar, even though I'd really love to. What I can do is give you the config, mabye you find something wrong there?
const options = {
plotOptions: {
series: {
dataGrouping: {
anchor: 'end',
approximation: function (groupData: unknown[]) {
return groupData[groupData.length - 1];
},
enabled: true,
forced: true,
units: [['second', [15]]],
},
marker: {
enabled: false,
radius: 2.5,
},
pointInterval: minutesToMilliseconds(30),
pointStart: currentWeekTraversed?.[0]?.[0],
},
},
}
This would be the plotOptions.
If you need any more information, let me know. I'll see then, what and how I can send it to you.
Thank you for helping. ^^
This is example how dataGrouping works with live data,
try to recreate your case in addition or use another demo from official Highcharts React wrapper page.
rangeSelector: {
allButtonsEnabled: true,
buttons: [{
type: 'minute',
count: 15,
text: '15S',
preserveDataGrouping: true,
dataGrouping: {
forced: true,
units: [
['second', [15]]
]
}
}, {
type: 'hour',
count: 1,
text: '1M',
preserveDataGrouping: true,
dataGrouping: {
forced: true,
units: [
['minute', [1]]
]
}
}
},
Demo: https://jsfiddle.net/BlackLabel/sr3oLkvu/
I want every time my mock changes and paesss to dataa, the barchart can re-render or updated. I watch dataa in barchart component, but it didn't work.
"console.log('this', this.dataa);" never trigger. I have no idea which part is wrong.
here is my code:
<sr-bar-chart
:title= "descriptionText.title_traffic"
:dataa= "mock"
:unit="descriptionText.avg7d_unit_people"
:index="'1'"
:barColor="'#adadad'"
and in bar chart component
export default {
name: 'sceneBarChart',
props: ['title', 'dataa', 'unit', 'index', 'barColor'],
data() {
return {
count: 0
};
},
watchers: {
dataa() {
console.log('this', this.dataa);
this.drawMap();
}
},
methods: {
drawMap() {
....
}
},
mounted() {
this.drawMap();
}
};
Thanks!
Use watch rather than watcher and just for good measure I'd add the newValue parameter as well.
watch: {
dataa(newValue) {
console.log('this', this.count);
this.drawMap();
}
here is more info on watched properties: https://v2.vuejs.org/v2/guide/computed.html#Watchers
I'm having difficulty deactivating the Advanced Content Filter (config.allowedContent = true; dosen't seem to work). I've tried everything that I've read on the forums, including clearing the cache, and making it an external file.
CKEditor 4.2.2 - allowedContent = true is not working
I've even added config.protectedSource.push lines, and they work to a point. The CKEditor still adds div tags and partially deletes other tags.
I'm creating a set of well designed templates for clients to use, so In the end I don't want CKEditor to touch my code at all. Here is what I have in the config.js. If anyone can see something I did wrong, or knows of a way to make it work, please help this somewhat stressed web guy.
Thanks,
Rusty
CKEDITOR.editorConfig = function( config ) {
config.toolbarGroups = [
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
{ name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
{ name: 'insert' },
{ name: 'links' },
{ name: 'others' },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align' ] },
{ name: 'styles' },
{ name: 'colors' },
{ name: 'tools' },
{ name: 'about' }
];
// Define changes to default configuration here. For example:
// config.uiColor = '#AADC6E';
// misc options
config.allowedContent = true; // allowedContent doesn't work :-(
// Protected Source
config.protectedSource.push(/<section>[\s\S]*?<\/section>/gi); // allow <section></section>
config.protectedSource.push(/<span>[\s\S]*?<\/span>/gi); // allow <span></span>
config.protectedSource.push( /<link[\s\S]*?\>/g ); // allow <link> tag
config.protectedSource.push( /<!--[\s\S]*?\>/g ); // allow <comment> tag
config.protectedSource.push( /<br[\s\S]*?\/>/g ); // allow BR Tags
config.protectedSource.push(/<script>[\s\S]*?<\/script>/gi); // allow <script></script>
config.protectedSource.push(/<div>[\s\S]*?<\/div>/gi); // allow <div></div>
config.removeButtons = 'Anchor,Iframe';
config.format_tags = 'p;h1;h2;h3;h4;h5;h6'; // format button options
config.height = '500px'; // edit window height
config.skin = 'moono';
config.stylesSet = 'vam_styles:/templates/admin/-css/vam_styles.js'; // style button options
// Only add rules for p and span elements.
config.stylesheetParser_validSelectors = /\^(p|span\div)\.\w+/;
config.stylesheetParser_skipSelectors
};
I'm creating a set of well designed templates for clients to use, so In the end I don't want CKEditor to touch my code at all.
This is not possible. CKEditor is not a web site builder into which you can load any possible HTML. It is a rich text editor. So you should use it to edit the textual part of the website, not the whole layout.
For instance, if you had a layout with two columns and some header above them, it would be best if there were 3 editors - one for each column and one for the header. Of course, in this basic case CKEditor could be used to edit or 3 sections at once, but the more complex the layout the more important it is to use CKEditor correctly.
PS. It's CKEditor, not ckEditor.
Thanks for your reply.
I wasn't talking about site design templates, but page design templates. On the Full featured version of CKEditor there is a template button that we've been able to enhance. We now are able to let our clients choose several well designed page layouts that are responsive for different devises. It is very effective.
After trying everything I found the culprit that was causing the problem. I was using <br> instead of <br />. As soon as I switched the editor left my code alone.
Best Wishes!
Rusty
I am working with kendo ui controls.my functionality is to filter the grid based on date-time and drop down selection. This is working on chrome but not in FF and IE.
var gridResult = $('#Grid').data("kendoGrid");
var condition = {
logic: "and",
filters: [
{ field: "Category", operator: "equals", value: $("#nw").val() },
{ field: "Device", operator: "equals", value: $("#pro").val() },
{ field: "Orig", operator: "equals", value: $("#work").val() },
{ field: "Term", operator: "equals", value: $("#network").val() }
]
};
if (mindate !== null) {
condition.filters.push({ field: "Time", operator: "ge", value: new Date(mindate) });
}
if (maxdate !== null) {
maxdate = new Date(maxdate);
maxdate.setHours(23, 59, 59, 999);
condition.filters.push({ field: "Time", operator: "lt", value: maxdate });
}
gridResult.dataSource.filter(condition);
return false;
});
$('#fromdatetimepicker').attr('readonly', false);
$('#todatetimepicker').attr('readonly', false);
}
When i debug in firefox i didn't find aby bug can any one look at the code and please tell me where i am wrong?
I've been testing your code and I can't find any problems with it, besides that you have an extra ) at the end but that's probably because the function is cut from a larger section of code.
There are however several things that might be causing this problem and there's a lot of code missing so I can't say for sure. Some browsers try to help you out by ignoring errors you make. This can make it work in Chrome but not in FF and IE. The best way to deal with this is to go through the code and add validations that confirm the values every time the Filter method is call. Here are my suggestions for you:
When debugging in Internet Explorer, use IE 11 and use the F12 debugging tool.
You check that mindate and maxdate are not null, but if they're undefined or contain an empty value, they'll pass that test and will be added to the filters even though they're not set.
You don't have any check that mindate and maxdate are valid dates and that you successfully are able to create the JavaScript date variable, before adding it to the filter. This could be a source of error, depending on the other code in your script.
You use the values from $("#network").val() etc directly in your filter without validating them, and that could cause problems in the future. But this is not causing this error.
Edit: Encoding
You need to make sure the encoding of your webpage is correct. Please make sure these two lines exist in the head section of the html code. If you use ASP.NET MVC you can add these two files to the Views\Shared\_Layout.cshtml file. If you use ASP.NET Forms you can add them in your Masterfile. If you use PHP you just put them in the head section.
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
I have a column named event_date. I want to warn the user if he trys to submit the info without filling up the event_date column and prevent further execution. Here is how I define my column:
header: 'Event_date',
width: 115,
dataIndex: 'event_time',
renderer: this._renderExactDate,
field: {
type: 'textfield'
}
and my render function is:
_renderExactDate: function(date) {
if (date == '0000-00-00 00:00:00' || date == undefined) {
Ext.MessageBox.show({
title: 'New event',
msg: 'You must set a date',
icon: Ext.MessageBox.ERROR,
buttons: Ext.Msg.OK
});
}
else
{
return date;
}
}
but obv. renderer is not the way to do this, yet I haven't found a way to do this.
thanks
Leron
If this is using ExtJS4 then you should make use of the model field validations field to set the accepted format. Write a custom one if any of the standards don't fit the bill. Then you can check if the model is valid before any attempts to sync and flag a warning accordingly.
The event you want to hook into is this one. Then you can get the record/model and check its 'isValid' method before generating your warning.
Link: Ext.grid.plugin.CellEditing validateedit event