I am using CkEditor to edit content and calling that page via ajax. It is working fine for first page load. But when I load another page, in console I see error that Instance is already exists. So tried to replace all textarea using CKEDITOR.replaceAll(); in everypage. But Again I get same error. When I searched for this error. I came accross other stackoverflow question With answer
if(editor.instance(Instancename) {
CKEDITOR.instances.textarea.destroy();
}
But I have multiple textarea,generated randomly so I can not use that code as I don't know id or name of textarea. Anyone have better suggesation what I should do to replace textarea to ckeditor?
When you are using CKEDITOR.replaceAll()
will create an instance but you are not reloading the page, so it will not destroy.
You have to distroy it manually.
But as you said you have multiple textarea generated randomly, you can use
CKEDITOR.replaceAll('className');
All you have to do is give classes to text-area (same class in onepage) and write this code right after you appending html to div.
And use /ckeditor/adapters/jquery.js
Related
I'm using the ck-editor(4.4.6). In Ck-editor's textarea I want to update my text, for that I use setData("hai"); that text updating correctly but some plugin functionality not working after use this setData(); (eg. restrict multiple enter if I reload the page it's working correctly).
editorInstance.setData("test text");
Anyway first time and after reload the page it working fine.
ruby on rails with jquery things are I'm using.
How can I solve this?
I don't know about ck-editor(4.4.6) but i can give you a way to solve it. You have to use based on your parent class. First time it works because it was same but after that it did't find the class/your specific term/attribute. So you have to use by calling parent class/id and under your activity.
You will need to call the update element function after setting the data, this will actually set the value in the field.
And, also you will need to specify the id of the textarea as given below.
CKEDITOR.instances.id_of_textarea.setData('hai');
CKEDITOR.instances.id_of_textarea.updateElement();
Finally, I got the answer instead of set data I just add my content to CKEditor text area as link this its working fine:
$('#cke_editor1 iframe').contents().find('body').html("Your text");
I need to do a local search visible text on a single simple html page. Users can simply use Ctrl+F to do that, but I would like to add a search box on the page to do the search instead. I thought of a couple ways to do this:
1- By forcing the browser's Find tool when a button on the page is clicked.
2- By a javascript/Jquery plugin that do LOCAL search on the current page.
I searched for both solutions but was not able to find anything useful. Does anyone here have any suggestions?
You can give a common class name to the tags that contains the display text and perform a search based on that class name. I had attached a link for your reference. you can make use of that funtion and call that function from a button click.
Generic Search in HTML Page
I'm creating a webform using a marketing automation platform. I want to add a field that functions with jquery to do an autocomplete. Unfortunately, the forms are generated through a WYSIWYG editor in the software, and then generated and put into the page when it renders. The only code for the form that appears in the HTML for the page is a simple variable placeholder - %%FORM::DEFINITION%% - which is then replaced with the form code when you visit the URL. The software support team tells me that making the change I want to make is impossible, which I see as a challenge.
The only thing I need to be able to do is add an id="autocomplete-dynamic" attribute to the input on the form. I had two ideas how I could achieve this.
The first, and most preferable option, would be some script that runs at the bottom of the page that simply inserts the attribute into the input tag after the page renders out. This would only be a client-side change, but since all this does is make the text field capable of looking up values out of another table, it should be fine. If someone had a script blocker in place, they would not be prevented from typing into the text field normally, it's just that the auto-lookup wouldn't work. We're trying to make it easier to select an item from a list of thousands of possibilities, but if someone had to type in their own entry without the autocomplete, it would not be a disaster. This seems like a clean solution, but I am not sure if it can be done.
The other possibility is to get the form code out of the software and embed it in a separate HTML document, and make the change there. You can extract the raw HTML for the form for use on another page, but pasting this code right back into the landing page causes errors. So, the thought then was that if I have taken the code generated by the software and put it in an HTML page on a separate web server, I could modify it as needed, and then turn around and use an iframe to stick it right back in the landing page. The software shouldn't complain because the form is being used on an external site like it's supposed to be... I have just hidden that external site back inside the platform-hosted page.
Option 1 would still be much easier to implement, I think, provided it is actually possible.
Thanks in advance.
Your first solution seems completely appropriate.
$(function() {
$('#myForm input').attr('id', 'autocomplete-dynamic');
});
This can be added anywhere inside a script tag because it's wrapped in a shorthand document.ready function, which waits to run until the DOM is ready.
I'm running into an issue where I have a button on my page that has a CKEditor.
When the button is pressed I want to append text to the editor.
I used the following code:
$('#mtxDescription').append($(this).data('key'));
CKEDITOR.instances['mtxDescription'].updateElement();
However this does not work. The editor does not reflect the change. However when I inspect the editor I find that the textarea does show the appropriate text appended, its just the editor is not showing it. Does anyone know of a way to get around this. Also, just in case anyone is wondering, I do have the jquery CKEditor adaptor script referenced in my page.
Also, if a somewhat related, but separate issue.
I have a drop down list that will allow the user to toggle between the text area shown on the page being the CKEDitor WIZIWIG and going back to being a normal textarea again. However I can't seem to do this without literally refreshing the page, I want to do it through javascript/jquery so I don't have to refresh the page whenever the change the dropdown selection. I've already tried the built in destroy method. It doesn't seem to do anything visually, the editor does not revert back to a simple textarea.
Just in case you were going to ask for some more code, here is what my HTML page looks like:
<textarea id="mtxDescription" name="mtxDescription"></textarea>
Here is how I initialize the editor
CKEDITOR.replace('mtxDescription', {
sharedSpaces: { top: 'ed-top'}
});
I was able to solve this problem by using the following code instead of using jQuery CKEDITOR.instances.mtxDescription.insertHtml($(this).data('key')) I still need a way to remove the editor at runtime.
I was trying to remove a certain div element from my HTML using jQuery I saw this Use jquery to remove a div with no children, the jquery remove methods work perfectly fine but the problem is of Persistence,
Actually i want to permanently remove that div for that person, i was storing this in cookies but the problem is this remove method doesn't actually remove the code so when I parse through the code to store it using the cookies i store the removed code also. is there any way i can achieve a permanent removal for particular person??
Thanks
Pranay
Since many people are confused here is what I was trying to achieve http://virtser.net/inettuts/ this was demo of http://james.padolsey.com/javascript/inettuts-with-cookies/ where he extended functionality of his code by adding Cokkiee support to retain the widget positions.
This code works fine for moving editing and collapse or expanding widget. It saves everything in cookie but for delete this does't work. It delete the widget but when i try to save it in cookie since the div element is present in code it does't save the deleted item
jQuery isn't ideal for permanent removal of elements from a page as it's stateless.
Its a client side wrapper for javascript to interact with the DOM. While in theory, you can have it remove elements from the DOM based on readable cookies a particular user may have after a page has loaded, it's not ideal when server side coding could handle this without much effort.
to remove it permanently you have to use serverside language for example php
You could revert the process and add the DIV for specific users instead, leaving the data in the .js instead.
To remove DIV "permanently" you have to use serverside lang. The logic is simple:
Remove DIV from HTML
Save some info about user and removed DIV in cookies
In serverside script you have to get cookie and check did user disable any div or not. If he did your script should skip DIV generation