I was wondering if there is a way to protect a piece of html or text inside the jquery inline content editor jwysiwyg?
For example, I have a div that I externally insert to the editor and I do not want the user to modify it.
I could not capture the keypress event inside it (iframe security?) and setting the div to readonly or disabled did not work.
Any ideas?
Thanks!
Just add a click event handler for that div so it throws an alert and disables (graying out) the rest of the page; something like a login dialog (check out jQueryUI dialog - http://jqueryui.com/demos/dialog/)
Try it!
To clear the content in the editor use
$('#wysiwyg').wysiwyg('clear');
If you want to set the content of the editor on the fly you can use
$('#wysiwyg').wysiwyg('setContent' response.message);
Related
I am using "CLEditor WYSIWYG HTML Editor v1.4.5"
When I open the window containing the TextArea element I'm using with clEditor, the Editor comes up disabled and it appears that the TextArea element is invisible. I have text in the TextArea element but the text is invisible.
If I right click on the body of the TextArea and select "Inspect Element", the debugger window opens and the Editor becomes enabled and the TextArea becomes visible. Then I close the debugger window and everything appears to be functioning correctly.
HTML:
<div id="maintBody">
<textarea id="woEditor" name="woEditor">This is the test data... is this editable?</textarea>
</div>
Javascript
$("#woEditor").cleditor( {height: "400"});
No CSS
If I comment out the Javascript .cleditor() call, then the TextArea element appears and functions correctly. So there is definately some setting in the editor initialization that is setting this state.
You can access this page at: http://test.nds.link then click on the "Props" Tab in the left column
Does anyone know what would cause the clEditor to come up in a disabled state, making the TextArea element invisible?
I had the same error while I using CLEditor inside a DIV which was toggled via jQuery.
The animation-Parameter cause the error! After I removed it, it works like a charm!
wrong way:
$("#cT_new_form").toggle("slide",700);
right way:
$("#cT_new_form").toggle(700);
So don't use "slide" as animation or CLEditor won't focus after slide!!!
The following fixed this issue for me without having to remove the effects:
cleditor problem with jquery ui effect()?
I have a HTML markup in a template which has input element. I load it via Ajax call and put in existing html using jQuery's $(selector).html(response).
Basically it is a pop up box which loads from template. After loading pop up box I want to set focus on input box. I've written this code :
$("#prescribe-input").focus() after content is appended in existing HTML but it does not work. I tried doing it in traditional javascript way too document.getElementById("prescribe-input").focus()
Both do not work. For testing purpose I tried creating sample input box in Index.html of an app and set focus. it works perfectly. The problem is when I load html from template using $().html() it does not work.
Any way to focus it properly?
I know the code is very less here but the question is self explanatory I believe.
if you are using jquery then you can use .on() on dynamically generated elements
$("#prescribe-input").on( "focus", function() {
//do what ever you want
});
You should do this in the callback function:
$(selector).html(response, function(){
$("#prescribe-input").focus();
})
I have integrated InnovaEditor in my project from where admin can enter html code to show on site.
My question is I want to prevent user to insert javascript event in html of editor.
For ex. if user add Mouse Over Here
Then onmouseover event should be removed. This feature is available in tinymce but not in innovaeditor. TinyMCE will remove events while user add code in html mode.
Can anyone help me out for this?
Huhh.. I have figured out the event on which I can use regex to clean html code.
I am using onSelectionChanged event of Innovaeditor.
oEdit1.onSelectionChanged=function(){
var html = oEdit1.getXHTMLBody();
html = html.replace(/ on\w+="[^"]*"/g, '');
html = html.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
oEdit1.putHTML(html);
};
Same script used with form validation on submit.
This code will remove script tag and all events from html code.
I have a textarea in inside which the user adds some content and edits it time to time.
I want to have that text point to URL (i.e a hyperlink inside a textarea). But since itis not possible to have a hyperlink inside a textarea, is it possible to make the whole textarea link to a URL itself ?
Add onclick event handler to the textarea and set window.location with the location you want to do to.
Other option is to use a editor like CK Editor or YUI Editor
you can use jquery:
<a href='http://example.com' style='display:none' id='textarea_link'></a>
<textarea id='textarea1'></textarea>
<script type='text/javascript'>
jQuery('#textarea1').click(function(){jQuery('#textarea_link').click()});
</script>
Then when you click on the textarea it will pass the click event onto a link and your browser will treat it as if you clicked on the link.
Note: this is not using the javascript window.open function on purpose
I am using CKEditor for mailbox. After typing the content in the editor, I need to click on send button. After clicking the mail goes, but without the content that I have typed in it.
This is because the CKEditor is not updating the value of content until I select the typed text and perform some operation from the toolbar, like Bold, Italic etc.
I have added a javascript: onclick to the send button and trying to reload the editor or perform some operation from toolbar .
Neither I can use JQuery nor any plugin to solve this. What else can I try for this?
Try adding this function to the page and call it on the onclick of the button. It'll update the textarea's with the value of the ckeditor
function UpdateFields() {
for (instance in CKEDITOR.instances) {
CKEDITOR.instances[instance].updateElement();
}
}