I am using Wiris Editor as a plugin in TinyMCE. When I insert equation from Wiris Editor it displays it as an image in TinyMCE - I found this is embedded image but when I click the source tag to save the content it is the mathml format. I am unable to save the equation and searched almost everywhere but could not find a solution and I don't know why this is happening.
well.. you can not convert mathxml to HTML DOM Elements in a smoothly way. but you can make a trick to trace the code from the inspect element by the help of console.
wiris plugin used to render a iframe so you have to dig into the iframe document first.
$(function(){
// here "task_case_in_ifr" is the id for editor iframe div.
var iframe = $("#task_case_in_ifr")[0];
var iframeDocument = iframe.contentDocument
var iframeContent;
if (iframeDocument) {
// "tinymce" is the id for parent div containing all equation in the div.
iframeContent = iframeDocument.querySelectorAll('#tinymce');
}
var content = iframeContent[0].innerHTML
// save to database content variable..
// then show this value from the database on load document in jquery
// at first load it to the hidden element containing id.
// eg. div id is "#t1"
// fetch from the DOM by
iframeContent[0].innerHTML = $("#t1").html();
});
Related
I've to select an year from the list were in HTML response is having two div tags. click on first div, year list will be open then choose an year from the hidden portion of tag.
And the response for the HTML div tags are placed below
Hi based on your markup you can try getting all elements in the tag and check their contents for text match(date) alternatively an Xpath.
Here's an idea on how to go about implementing the iteration and scrolling
Hope this helps
List<WebElement> options = driver.findElements(By.tagName("ul"));
for(WebElement option: options){
if(option.getText().equalsIgnoreCase("Date")){
option.click();
}
else{
//TODO Scroll select or User Action
}
}
So I've used FCKeditor for TinyMCE. This integrated easily and gave my customers a nice way to upload files while selecting them. To integrate this I used the following code:
function fileBrowserCallBack(field_name, url, type, win) {
var connector = ROOT + "path/to/tiny_mce/filemanager/browser.html?Connector=connectors/php/connector.php";
connector += "&Type=" + type;
browserField = field_name;
browserWin = win;
window.open(connector, "browserWindow", "modal,width=600,height=400");
}
And file_browser_callback: "fileBrowserCallBack" in the TinyMCE call.
Now I want to use this same function to fill a simple input-tag so my users can select an image for a custom background.
Now I created an onClick event on this input field that opens the file-browser. But when I select a file I get the following javascript error:
TypeError: window.top.opener.tinyfck is undefined
So how can I use this same plug-in as a regular file-browser making it return the selected file?
Edit: The actual name of the plug-in I used is TinyFCK
Unfortuanatly, this is not possible. The tinymce image uploader needs the tinymce document structure which is not present when you use another kind of editor.
Users should be able to insert images on a news. If they are inserted they should open with fancybox. Therefore I installed jqfancybox. Now the images added as media opens in the fancybox and the user is able to click through all images (like a gallery). What do I have to do to also open images inserted by the RTE?
I tried the following typoscript:
plugin.tt_news.displaySingle.image.imageLinkWrap {
JSwindow = 0
directImageLink = 1
linkParams.ATagParams {
dataWrap = class="jqfancybox" rel="fancybox"
}
}
The idea is if an user inserts an image with the option "click enlarge" the above shown class should be added as well as the rel attribute. The rest should do the fancybox. But for existing images no class is added and fancybox doesn't pop up. What I'm missing?
Edit:
Now I tried it with:
plugin.tt_news.displaySingle.content_stdWrap.parseFunc {
postUserFunc.imageLinkWrap.typolink{
ATagParams {
dataWrap = class="jqfancybox" rel="fancybox"
}
}
}
but the link is not wrapped.
RTE content is parsed via parseFunc < lib.parseFunc_RTE. So if you want to change the config, you need to configure plugin.tt_news.displaySingle.content.parseFunc.* (i am not sure, if the field is content or bodytext or whatever)
lib.parseFunc_RTE is a default Config for parsing RTE content. It is quite powerful, but you need to lookup a lot of TypoScript functions.
I'm trying to set the value of a textfield using the following code:
if (ie.TextField(Find.ById("testField")).Exists)
ie.TextField(Find.ById("testField")).Value = "Test";
The code passes without raising an error, however the textfield is not filled with the value.
I get an exception when I execute the following line:
ie.TextField(Find.ById("testField")).Focus()
The textarea is a tiny_mce editor and one of the html attributes is: style="display: none;"...
Any ideas how I can modify the value of such a field using Watin?
Thanks.
First tinymce is not a textarea. tinymce hides your textarea on initialization and creates a contenteditable iframe which is then used to allow text editing, styling aso...
Second if you want to write the editors content back to the hidden textarea you may do this using
tinymce.get('testField').triggerSave();.
Another way to set the value of your textarea is:
tinymce.get('testField').getDocumentById('testField').value = 'new value';
In case you want to write content directly to your tinymce editor you may choose on of the following
tinymce.get('testField').setContent('my_new_content'); // replaces the editors content
or
tinymce.get('testField').execCommand('mceInsertContent',false, 'my_content_to_be_added'); // adds the content at the carat postion
Here is a simple way to handle this using the Watin Eval function:
var js = "tinyMCE.get('body').setContent('" + bodyCont + "')";
var s = ie.Eval(js);
'body' needs to replaced with the id of the textarea that is hidden by tinymce - do a "view source" in your browser window to find this id.
I have a page where I add textareas to the DOM with javascript and I would like them to have a TinyMCE editor attached.
When I add the first textarea everything is fine.The problems occurs with the next ones added.
It looks something like this:
http://dl.dropbox.com/u/1918752/tinymce_problem.png
In the firebug console, there's an "d is undefined" error thrown.
I'm using
tinyMCE.execCommand("mceAddControl", false, 'textarea_id');
to add TinyMCE control to the newly inserted textarea.
I'm using TinyMCE version 3.0.1 and unfortunately upgrading isn't really an option now.
Later edit:
The function I use to insert textareas:
function add_fields(link, association, content) {
var new_id = new Date().getTime();
var regexp = new RegExp("new_" + association, "g");
var reg = new RegExp("child_", "g");
$(link).up().previous('ul').insert(content.replace(regexp, new_id).replace(reg, "child_"+new_id));
if($('estore_products_category_children_attributes_'+new_id+'_description')) {
tinyMCE.execCommand("mceAddControl", false, 'estore_products_category_children_attributes_'+new_id+'_description');
}
}
The content parameter is where the textarea is.
This is used in a rails application, and I created a helper which returns a standard chunk of html based on the types of associations used, and then I replace the generic ID's with new unique ones and insert in into the DOM.
I think you did not shut down tinymce correctly in order to recreat an edito instance with the same id!
To shut down an editor instance correctly use:
tinyMCE.execCommand("mceRemoveControl", false, 'textarea_id');
This is necessary when you move the editor around inside the dom or when you remove parts of the dom containing the editor iframe.