I am still very new to CKEDITOR.
Is there an event or a way to get notified whenever a new p element is created?
The p element is created when user presses enter.
I will need to access that p element so that I could insert a custom tag.
The CKEDITOR version is 4.1.
Thank you!
There's no way to do this (almost, but I assume we're sane). You can, however, easily append anything to your DOM structure when obtaining data from the editor by playing with dataProcessor (editor.dataProcessor.htmlFilter.addRules()).
See some pieces (sample#1, sample#2) of code to get the idea. You can modify children of elements as well.
Related
I am using DHTMLX, and I have output that goes to a div. The text gets into the div using "attachHTMLString", but after it's in that div, I don't know how to access it.
I'm used to using jQuery where you can assign an ID or class and traverse the DOM and get it. With DHTMLX, it's like jQuery's powers are useless. I just cannot get the data that is right in front of me.
I'm looking for something like:
var divText = dhtmlxElement.getText();
What's the secret to traversing the DHTMLX elements?
I just figured out, the way to do it is to give the element an ID when it's created. Later, you can just call it out by ID.
What apparently does NOT work is to refer to the element on the page by its DHTMLX name and try to "get" it, or capture its text.
But what component are you asking about?
I.e. you can really get the text of tree node by ID...
var text = tree.getItemText("itemId");
And many other components provide this feature
I have a situation where I am cloning an element containing a CKEditor instance. After cloning, I change all the ids to make sure I don't have two elements with the same id in the same page. I am having trouble accessing the cloned version of the CKEditor. Indeed, if I access it via the elements id, I get the original (not the clone with the new id). I can access the replaced textarea without problem, but not the CKEditor.editor object that goes along with it. Is it possible to access this object by using the replaced element (and not its id)?
N.B Please tell me what I can add here to make the question clearer...
Follow up
I figured out that I was thining about this the wrong way. When I clone the element containing the CKEditor, I have a copy of the element, but the CKEDITOR object doesn't know about it. What I ended up doing is simply removing the html associated to the cloned editor and calling CKEDITOR.replace again to replace the cloned textarea. I hope this is understandable, I don't have much time to write. If things are unclear, leave a comment and I will clarify soon.
If you are using the jQuery adapter, you can get the CKEDITOR object using the following...
$(element).ckeditorGet();
I'm not 100% on what the question is, but here is something that may help, if you have a textarea with id "content" and you replace it with the editor then you can access the instance from CKEDITOR.instances as:
CKEDITOR.instances.content OR
CKEDITOR.instances[content] OR
CKEDITOR.instances["content"]
Now when you change the id of the cloned text area to lets say "content2" and the clone editor instance is not in CKEDITOR.instances then you need to replace the clone after the id is update.
CKEDITOR.replace('content2');
So the editor will have more than one instances "content" and "content2". You can loop through the instances and verify them and use the one you need.
for(x in CKEDITOR.instances){
var instance = CKEDITOR.instances[x];
// do something with the instance
}
After joning data with my group I would like the elements in the enter selection to be added to a group (g-element) on top/highest up. Default is to append to the bottom.
The reason for this is that I want the object to visually appear below the all ready visible objects.
I know I can order and sort but I thought there might be an easier/better way to do this. I have done several manual things only to later find out "Oooh, they included a smart way to do that, EASILY."
D3 does have an insert method: https://github.com/mbostock/d3/wiki/Selections#wiki-insert
Excerpt from Reference
For instance, insert("div", ":first-child") will prepend child div
nodes to the current selection.
https://github.com/mbostock/d3/wiki/Selections#wiki-insert
Does anyone know how to delete an element from the source using Watir? There doesn't seem to be a method for removing elements. Perhaps I'm missing something.
If you know JavaScript, you could execute any JavaScript code on the page.
Example:
browser.execute_script("some javascript code")
I am not a JavaScript ninja, but this question could help you: JavaScript: remove element by id.
Remove elements by css:
browser.execute_script("[...document.querySelectorAll('.some.class')].map(e => {e.parentNode.removeChild(e)})")
We can remove it with javascript. Here's an example to remove a breadcrumbs div element but it's id:
browser.execute_script("bd = document.getElementById('breadcrumbs'); bd.parentNode.removeChild(bd);")
The Purpose for Watir is to do web testing, which is to say drive the browser as if a user was interacting with it. That means doing the things a user could do, clicking on stuff, filling in input fields, etc. It also means being able to verify what is there on the screen that the user can see or interact with.
Since a user cannot delete elements, there is no means by which to do that using the tool.
If the application provides a way for users to 'remove' or 'delete' something, like closing a simulated window, removing a tab etc, then you need to do that by simulating what the user would do (usually clicking on some specific element) in order for that to happen.
I'm new to building extensions -- and would like some help with knowing how to target the standard Google search bar that comes with Firefox..
I am thinking I have to find out which meni ID it is and assign it somehow within the .xul file..
From chrome (normally overlay of the chrome://browser/content/browser.xul) you can get access to search bar by getting it with document.getElementById('searchbar') The best way to find ids you need is by using Dom Inspector: https://addons.mozilla.org/en-US/firefox/addon/dom-inspector-6622/
Anyhow, if you want to access inner dom elements of the searchbar you'll need to use getAnonymousElementByAttribute because that's anonymous content (from XBL binding). So if you need to get input element itself (where you're typing your search terms) you'll do it something like this from chrome:
var searchbarElement = document.getElementById('searchbar');
var input = document.getAnonymousElementByAttribute(searchbarElement, 'anonid', 'input');
You'll need to use Dom Inspector to figure out which element you need and how to access it.