I am using the TinyMCE WYSIWYG editor for a ASP.NET MVC project. Although the editor is working, when the page loads the underlying textarea is visible for a brief moment before the editor kicks in - the raw textarea is visible for about, give or take, a second. Is there a way to only load the content once the TinyMCE editor is ready?
I'm using Bootstrap and if I assign the textarea a class of hide (which essentially is just a display: none CSS style) the textarea is hidden, and the editor renders when it's initialized.
Populate the data on the TinyMCE's init event.
function myCustomOnInit() {
alert("We are ready to rumble!!");
}
tinyMCE.init({
...
oninit : myCustomOnInit
});
code from http://www.tinymce.com/wiki.php/Configuration3x:oninit
Related
My question is the same as this Stackoverflow question, I want to prevent the brief flash of HTML that happens on a page with a TinyMCE editor. The problem with the answer to that other Stackoverflow question is that it does not seem to work with TinyMCE 4. I set display:none; of the textarea containing the HTML to edit. And in the init callback for TinyMCE, I reset it to display:block;. All that happens is that the original textarea is displayed on the page, with no sign of the TinyMCE editor.
Try using the visibility property instead.
I am trying to set the cursor on the textbox that has been set to a kendoAutoComplete, but the cursor does not show.
Using Kendo's AutoComplete basic demo I am running the following code in the Chrome Developer console, but the cursor is not showing.
$('#countries').focus()
When the code is run, I do see that the span around the input box does get the 'k-state-focused' class which changes the border color to gray, but that's all it does.
From what I can tell, the 'k-state-focused' css class doesn't hide the cursor. So not sure if Kendo is somehow intercepting the focus in JavaScript and not setting it, or because the textbox has a span around it, the focus is being hidden.
Instead of $('#countries').focus() do $('#countries').data("kendoAutoComplete").focus().
Due to Kendo UI decorations around HTML elements you should use AutoComplete focus.
The first answer didn't work for me. It could be because I'm using UI for ASP.NET Core, but this solution did work:
$(document).ready(function () {
setTimeout(function () {
$("#myInputId").focus();
});
});
This is the explanation from Telerik - "The AutoComplete widget is designed to persist the focus of the input when popup element is clicked. The select is raised between of the open->click->close chain and that is why we will need to use setTimeout function to focus other input."
How can i disable horizontal scroll bar in gwt-richtextarea
I applied overflow-x:hidden and is working fine on firefox but not working on IE
RichTextArea uses an iframe to embed the editable html document.
When you set styles to the rich area, you are setting them to the iframe element, but in your case you have to set styles to the body element of the iframe #document.
The problem here is how to get the content document of the iframe, you have to use jsni, or use a 3party library like gwt-query.
This works with qQuery:
import static com.google.gwt.query.client.GQuery.*;
RichTextArea area = new RichTextArea();
RootPanel.get().add(area);
$(area).contents().find("body").css($$("overflow-x: hidden"));
Another issue is that the creation of the editable document in the iframe is delayed in gwt. So it is safer if you delay the setting of styles, using a Timer.
With gquery you can use the delay() method
$(area).delay(100,
lazy().contents().find("body").css($$("overflow-x: hidden")).done()
);
I am the tinyMCE beginer...
i display the tinyMCE editot in browser and make able to add the style to the textarea content
How to get the html code from tinyMCE editor using Php,Javascript...
You may use
tinymce.activeEditor.getContent()
or if you know your editor id
tinymce.get('my_editor_id').getContent();
I'm trying to make a rich text editor with an autocomplete feature. Right now i'm using NicEdit to turn a textarea into a rich text editor, works ok(i'm using it for its simplicity). Also i'm using the autocomplete feature form jQuery successfully on textboxes or textareas, but if i try to use the same textarea that NicEdit uses(that is a text area with "textareaID" id), it doesn't work beacause NicEdit changes the textarea into DIVs with different IDs(in my case the html source ID for that DIV is "nicEdit-main"), and the autocomplete does not work on the DIVs ID.
So, autocomplete does not work on:
$("#nicEdit-main").autocomplete({...
neither does on:
$("#textareaID").autocomplete({...
An idea on how i can accomplish NicEdit and autocomplete to work on the same textarea, will be appreciated.