Is it possible to use the stylesheet parser in full page mode? I can get either of these features to work, but not both. For example, the following settings result in an empty styles combo box.
var editor1 = CKEDITOR.replace('editor1', {
contentsCss: ['myStyles.css'],
stylesSet: [],
fullPage: true,
allowedContent: true
});
If I comment out the "styleSet: []" line, then the combo box gets populated with the default styles, and mine don't get added. On the other hand, if I comment out "fullPage: true", then my styles get added, but I'm not in full page mode.
I'm using the latest version of ckeditor (4.4.7). Thanks for any help ...
Related
I need the default bootstrap css left intact when printing a table with a fixed header, but need to override a couple of styles relating to overflow as the table is scrollable vertically.
Basically I want targetStyles: ['*'] left in to match what is in my bootstrap css template, but need to override tbody {overflow:auto} and another custom style of .table-responsive {overflow-x:auto} . How can I keep all the bootstrap css but change these two styles for a print job?
I've tried using targetStyles: and style: with a list of these two styles. https://printjs.crabbly.com/#documentation is helpful but not intuitive (yet) for this scenario
/* my table is contained in a div with id of #howDoingTable */
printJS({
printable: 'howDoingTable',
type: 'html',
targetStyles: ['*'],
style: '#howDoingTable tbody {overflow:none;} #howDoingTable.table-responsive {overflow-x:none;}'
});
/*It's ignoring the style with the two overrides I want to implement via style:*/
Unless this isn't possible with just printJS in its current offering, I found out the workaround is to change the styles that need changing right before the call to printJS and then re-enable them right afterwards via jQuery:
//change overflow css to visible to remove scrolling in the ui
$("#howDoingTable.table-responsive").css("overflow-x","visible");
$("#howDoingTable tbody").css("overflow","visible");
printJS({
printable: 'howDoingTable',
type: 'html',
targetStyles: ['*']
});
//change the overflow css properties back to scrolling
$("#howDoingTable.table-responsive").css("overflow-x","auto");
$("#howDoingTable tbody").css("overflow","auto");
I can't find a way to limit the height of the ckeditor window.
I've tried all the solutions I've found through google and none work: Tables, divs, config commands after the CKEDITOR call like this is supposed to work but doesn't:
<script type='text/javascript'>CKEDITOR.replace('cTitle1');CKEDITOR.config.height = '800px';</script>
I have the latest version of ckeditor.
I don't want to limit it globally, just specific instances because there are times I want it to be regular size, and times I need it to be less tall.
Thanks in advance.
You can pass configuration object directly to replace method:
CKEDITOR.replace( 'editor', {
height: '400px'
} );
If you want to prevent the editor from resizing, you can also set config.resize_enabled to false in the configuration object:
CKEDITOR.replace( 'editor', {
height: '400px',
resize_enabled: false
} );
Please take a look at this example.
If you only want to limit height when the editor is being resized, you can add config.resize_maxHeight to the configuration object. Check the "Editor Resizing Customization" sample and documentation for more options and examples.
I've been trying to add syntax highlighting to my web app and found ace. However, after working at the solution provided in the documentation, I am still unable to change the editor theme. Does anyone know how to go about this?
So far I've just initialized the element with the following code
var editor = ace.edit("editor");
editor.getSession().setUseWrapMode(true);
editor.setHighlightActiveLine(true);
editor.setShowPrintMargin(false);
editor.setTheme('ace-builds-master/theme/tomorrow_night.css');
editor.getSession().setMode("ace/mode/javascript");
In the build mode argument to setTheme() is not a path but an id of the theme so you need to call
.setTheme('ace/theme/tomorrow_night') instead
Note that you also can set all the options in one call using
editor.setOptions({
useWrapMode: true,
highlightActiveLine: true,
showPrintMargin: false,
theme: 'ace/theme/tomorrow_night',
mode: 'ace/mode/javascript'
})
or in newer version of ace pass object with options to ace.edit
var editor = ace.edit("editor"{
useWrapMode: true,
...
})
I have found a comment by zbacsi on jqgrids site under inline editing.
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing#how_is_the_data_organized
"zbacsi, 2010/08/02 20:23
There is an escaping bug with special characters. Try insert alert('hello') into a field. It should be displayed as common text, but its executed..."
I was able to reproduce this issue, on my own grid setup, using the below versions of jqGrid and jQuery.
jqGrid version - > 4.4.4, jQuery version - > 1.7.1.
This can also be reproduced on the inline editing demo pages for jqGrid, located at:
http://www.trirand.com/blog/jqgrid/jqgrid.html
Once there navigate to:
Functionality -> Formatter Actions and begin editing a row.
Inside of the column labeled 'Notes' insert the value: <script>alert('hi')</script>
Hit enter or click the 'Save' icon.
The alert('hi') gets executed rather than 'Notes' containing <script>alert('hi')</script>
Any additional information would be much appreciated, thank you.
It's not a bug. You can fix the problem by usage option
autoencode: true
which I personally strictly recommend you to use the option in all grids.
jqGrid have many options. I personally find default values of some options (see values in "Default" column on the page documentation) not optimal. One from such options is autoencode which default value is false. It means that all data used to fill the grid cells will be interpreted as HTML code fragments. Scripts are the only problem which one have, but inserting the text like a>b, </tr> or <-- could really break the page.
jqGrid allow to overwrite the default by extending $.jgrid.defaults. So I include on every HTML page JS file with my own default preferences. In the file there are lines like
$.extend($.jgrid.defaults, {
autoencode: true,
gridview: true,
height: "auto"
datatype: "json",
loadui: 'block',
...
});
I am trying to edit an entire html using fck editor. So that should contain tags like html, body ,DOCTYPE etc. But my problem is when I submit the data, fckeditor forcefully remove the above tags from the content. I want to avoid this. Is there any configuration issue there.
-Arun
look at this config option. CKEDITOR.config.fullPage. I believe it will permit you to edit the full page (and will preserve the contents) (i haven't used it.)
'ckEditor' (as it's now known) shouldn't allow html/script tags directly within the content. However if you have the latest version there is a 'source' view which allows all the source to be edited directly and may give you what you want.
Arun User this one .This is best solution for you.
var CKcontent = false ;
$(document).ready(function(){
// setup ckeditor and its configurtion
CKEDITOR.replace( 'content1',
{
//fullPage : true,
customConfig : 'config.js' ,
toolbar : 'BasicToolbar' ,
height : "300"
});
});
Set only fullpage : false if not show HTML content otherwise set true
Note: it implemented by me in our development