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.
Related
I have an tinymce editor in admin area where I want to use script tag. With using follows, I am able to use tag and save it. After that I can see it in database as saved. But the problem is that when I edit the same page again and the editor preloaded with content then it stripped the tag somehow. So I can not see it and edit it again.
valid_children : '+body[style],+body[script]',
extended_valid_elements : '*[*]',
So please let me know if there is any way I can stop these script tag stripping off. I have tried to consol log the editor.getContent() but it also show content without tag whereas I can see it in DB and frontend source.
Thanks
You are likely getting tripped up by trying to load the closing script tag as part of a string in JavaScript itself.
If you have a closing script (</script>) tag in a JavaScript string the interpreter is likely interpreting that as the closing of your script block and not part of the content in the string. In many cases this will simply break the page's JavaScript completely.
Here is an example in TinyMCE Fiddle that shows the correct way to pass a </script> tag in a string: http://fiddle.tinymce.com/Fvhaab
For example:
tinymce.editors[0].setContent(`
<p>This is NEW content in TinyMCE!</p>
<script>
var x = "test";
var y = 10;
</script>
`);
...will not work. If you use this attempt for the closing script tag you will see the editor does not appear at all as that closing script tag prematurely ends the entire section of JavaScript.
Instead you can escape the / in the closing script tag:
tinymce.editors[0].setContent(`
<p>This is NEW content in TinyMCE!</p>
<script>
var x = "test";
var y = 10;
<\/script>
`);
...and you will see that the script is loaded into TinyMCE as you would expect.
I am trying here the QuickView form of MS Dynamics CRM. The text fields are under IFrame. Through the below java script, it's accessible: fname
//enter fname value
browser.executeScript("window.onload = document.getElementById('NavBarGloablQuickCreate').contentWindow.document.getElementById('firstname_i').value = 'rupam'"); But only first name is selected, if we try to do for the rest fields, it's not working. Hence, decided to do it through protractor code,
// Swtich to iFrame
browser.switchTo().frame(element(by.id("NavBarGloablQuickCreate")));
// Setting anme in first name text field
element(by.id('firstname_i')).sendKeys('Indra');
But here, it says element is not contactable.
You almost had it but were missing the .getWebElement() from your switchTo line. This is required as per the protractor documentation.
// Switch to iFrame
browser.switchTo().frame(element(by.id("NavBarGloablQuickCreate")).getWebElement());
//set name
element(by.id('firstname_i')).sendKeys('Indra');
Can you try the below and let me know.
I am also facing same issue to work with Dynamics CRM Quick view forms.I am trying to set a values on different fields of Quick view forms using SendKeys().But the value is not showing and cursor is not moving from one control to anaother.I have tried to move TAB using protractor TAB values also.But it's not showing.
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();
});
Is it possible to use ckeditor on a form input instead of textarea, i am building a CMS and now trying to add ckeditor and majority of of fields are form input not textarea
Thanks in advance
You can use CKEditor on an element (a div, say) that has contenteditable set. In fact, by default contenteditable elements will have CKEditor editors instantiated. It seems unconventional to use a rich text editor on an input of type text but I imagine it could be done.
As far as I know CkEditor has to be created using a textarea. In saying this, I am using it in a Razor MVC view and its one of the classes in my form..
The request will be blocked though and you will get this error;
A potentially dangerous Request.Form value was detected from the
client
To get around this, you need to get the value of the CKEditor text and html encode it. You can do this
when submitting your form, intercept it on the onsubmit function:
<form id="myform" onsubmit="javascript:onFormSubmit(this);return false" >
...
</form>
Then in this onFormSubmit function
Get the value,
Set the property value to the url encoded value
Do a ajax call to your server with the data
Your function will get the CKEditor encoded value like so:
function onFormSubmit(form)
{
var editor = CKEDITOR.instances["EditorId"];
var richtextValue = editor.getData();
var urlEncodedValue = encodeURIComponent(richtextValue);
// TODO rest of code doing ajax post to submit your form and its data
// Here you need to do an ajax call to your server pass it the form data along with the url encoded CKEditor value for that property
}
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.