I found problem with NicEdit (Rich text editor)
when typing some text and click align button to align text. The text doesn't
align only on FireFox and got this message on FireBug
uncaught exception: [Exception...
"Component returned failure code:
0x80004005 (NS_ERROR_FAILURE)
[nsIDOMNSHTMLDocument.execCommand]"
nsresult: "0x80004005
(NS_ERROR_FAILURE)" location: "JS
frame ::
http://js.nicedit.com/nicEdit-latest.js
:: anonymous :: line 38" data: no]
Line 0
Please could you help me to solve this problem.
Thanks,
If you are using the compressed code, go to line 37 and find this code:
Search for B.contentEditable
You will find an if condition exactly like this:
if (B.contentEditable || !!window.opera)
Replace it with this:
if ((B.contentEditable || !!window.opera) && navigator.userAgent.indexOf("Firefox/3") == -1)
The above answer will bring you in iFrame mode, which is rather slow. You better look here: http://web2.0goodies.com/blog/javascript/nicedit-firefox-center-and-right-align-bug-patch/. This wil actually 'fix' the FF bug.
Just add this: document.execCommand('StyleWithCSS', false, false); ... right before your execCommand(cmd, false, val) command. Around Line 576.
nicCommand : function(cmd,args) {
if(navigator.appVersion.indexOf("MSIE") <= 0) {
//do not use for IE
document.execCommand('StyleWithCSS', false, false);
}
document.execCommand(cmd,false,args);
}
Related
I'm using pdfmake to generate a document that contains a number of sub-documents, e.g. a PDF containing invoices; each invoice is a logical document inside the PDF document.
I have a requirement that in the footer or header of each page I show "Page of " where both those numbers are relative to a single invoice, and not the overall document.
The header and footer callbacks look good, but only specify the page number and count relative to the entire document, and the pageBreakBefore callback doesn't generate anything like the documented information, and in any case I can't figure out how I could use it here.
This doesn't seem like a unique requirement, so hopefully I'm just missing something obvious.
Thanks!
I believe that pdkmake's header and footer function's arguments can only contain the global pageCount.
There is however a way to reproduce the behavior that you want, if you handle manually the pageBreaks :
const realPageIndexes = [];
let currSubPdfIdx = 0;
let currPageCountForSubPdf = 0;
const getPageBreak = (newSubPdfIdx: number) => {
if (currSubPdfIdx !== newSubPdfIdx) {
currSubPdfIdx = newSubPdfIdx;
currPageCountForSubPdf = 0;
} else {
currPageCountForSubPdf += 1;
}
realPageIndexes.push(currPageCountForSubPdf);
return {text: '', pageBreak: 'after'}; // return elem causing the pageBreak
}
The footer function, filling the page numbers, is called once the document definition generation is done.
If you handle every overflow by yourself, by calling getPageBreak(currentSubPdfIndex) at the end of each page, you will end up knowing which sub-Pdf is displayed in each page :
I display part of the 1rst subPdf in page 1:
I display the end of 1rst subPdf in page 2
I display 2nd subPdf in page3
I display 3rd subPdf in page4 ....
.
let subPdfIdx = 0;
pdfContent.push(subPdf1FirstPart)
pdfContent.push(getPageBreak(subPdfIdx))
pdfContent.push(subPdf1SecondPart)
pdfContent.push(getPageBreak(subPdfIdx))
subPdfIdx++;
pdfContent.push(subPdf2)
pdfContent.push(getPageBreak(subPdfIdx))
subPdfIdx++;
pdfContent.push(subPdf3)
pdfContent.push(getPageBreak(subPdfIdx))
realPageIndexes[] then looks like :
[ 1, 1, 2, 3 ];
The only step left is to tell the footer function to use the page counts we just created instead of the global page count :
const documentDefinition = {
content: [YOUR CONTENT],
footer: (currPage, allPages) => 'subPdf index is ' + realPageIndexes[currPage];
}
Please note that this method will fail if you don't handle overflows correctly:
if for example a paragraph is too big to fit a page, and you call getPageBreak() after that, pdfmake will automatically create a new page for the end of the paragraph (page which is untracked in our realPageIndexes) and then add the page caused by your getPageBreak() right after the end of the text. So just make sure not to overflow the page :)
I added as a callback custom string to afterLabel in chart.js tooltip.
tooltips: {
callbacks: {
afterLabel: function (tooltipItems, data) {
return 'my nice string'
}
}
},
I am using default tooltip and if possible would like to continue so. Problem is that "afterLabel" comes at a new line and I haven't found where to define the width (or remove line break). Question is similar. How do I define width of tooltip and/or remove the line break.
https://api.jquerymobile.com/filterable/
there seems to be a problem with the implementation of this widget in that, if you are typing into the text field, then press enter nothing happens, but then your next key press has no effect. eg:
focus on text field
press a ('a' appears in field)
press enter (no change)
press a (no change)
press a ('aa' appears in field)
I have logged an issue, however doubt it will get attention in the short term. Anyone suggest a work around?
At least we can tell JQM to restore the _preventKeyPress flag by simulating another keypress:
$(document).on("keyup", ".ui-input-search>input", function(e) {
var key = e.keyCode ? e.keyCode : e.which ? e.which : 0;
if(key == 13) {
$(this).trigger(jQuery.Event("keypress", {
srcElement: this,
bubbles: true,
cancelable: true,
which: 0,
keyCode: 0,
charCode: 0,
target: this,
currentTarget: this,
eventPhase: 2, // AT TARGET
type: "keypress",
view: e.view,
returnValue: true
}));
}
});
EDIT:
Just for the sake of completeness, here is the solution from Omar:
https://github.com/jquery/jquery-mobile/issues/8571#issuecomment-300430818
I need to use a Range Slider to set a time range (8-23) but I need some base conditions on it (I basically need the minimum range to be 1h):
When the two pickers are on the same position the right piker goes "+1"
On right limit (23) the values have to be "22,23)
Here is the code as I tested so far: JSFiddle URL
This works only before the right limit of the slider, when I have "23,23" or "22,23" my getSlide check function does not work properly and I don't understand how to fix it..
Any help?
Thanks!
I solved myself coding all conditions only in slide event:
...
slide: function (event, ui) {
val1 = ui.values[0];
val2 = ui.values[1];
if(val2-val1 < 1 || val1 > 22){
return false;
}
$("#start").text(ui.values[0]);
$("#stop").text(ui.values[1]);
},
...
The strange behaviour with the previous version is still not explained, but it works.
At the moment I have this:
tinyMCE.init({
// General options
mode : "exact",
elements : "fkField, lkField, ukcField, khField",
theme : "advanced",
plugins : "table",
width : "300",
height: "185",
// Theme options
theme_advanced_buttons1 : "fontsizeselect, bold,italic,underline,bullist, cleanup, |,justifyleft,justifycenter,justifyright",
theme_advanced_buttons2 : "tablecontrols",
theme_advanced_buttons3 : "",
theme_advanced_buttons4 : "",
theme_advanced_toolbar_location : "bottom",
theme_advanced_toolbar_align : "center",
theme_advanced_resizing : false
});
This gives me a editor with the size of 300x185.
Now in this editor, I would like to do so you can only write until the editor is full. (without the scroller)
So you are unable to enter more text, and the scroller should not appear (disable scrolling)
Right now you can at the bottom of inside the editor just make new line and it will add the scroller <- which i do not want to happen
How can i do this? Is this unpossible? I have made research for some time now, but maybe it's just me searching wrong..
Thanks
add in a ccs file the following code
.mceContentBody{
overflow-y:hidden!important;
}
and add the path of css file in content_css attribut of tinymce
content_css : /path/to/css/file.ss
You will need to write an own plugin. Check the editor height on each Keystroke (you may use the built in tinymce event onKeyUp). If the heigth changes remove the last inserted code.
EDIT: Howto get the current editor iframe heigth
var currentfr=document.getElementById(editor.id + '_ifr');
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) { //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight + 26;
}
else if (currentfr.Document && currentfr.Document.body.scrollHeight) { //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
}
I got it to work by adding this to my extra tinyMCE CSS file:
IFRAME {overflow:hidden;}
Previously, the scrollbars were only off in Firefox. This fixes it for Chrome as well. However, it does add a gray bar the side of a scrollbar at the bottom, so I need to enlarge the height of my text editor.
for me it worked by just adding rules to a regular stylesheet, it wasn't needed to add a css file to content_css attribute (example is in scss)
.my-tinymce-container {
width: 200px;
.mce-edit-area {
height: 200px;
overflow-y: hidden;
}
}
A lot simpler and easy solution would be:
tinymce.init({
selector: '#container',
},
init_instance_callback: function (ed) {
tinymce.activeEditor.getBody().style.overflow = 'hidden'
},
});
Explanation:
In Init callback get the body for TinyMCE and change style as required.
In this case to remove scrollbar overflow = 'hidden'.