How to populate javascript editor?

Question

I am using TEmbeddedWebBrowser to fill out an html form using the FillForm method. But my html form contains a fully javascript editor and I don't know how to do it.

Something like that:

 your comment : <script type='text/javascript' src='public/scripts/src/editor.js?1'></script> 

And send btton:

 <input type="submit" name="btnSubmit" id="btnSubmit" value="Send" class="btn" onclick="rtevalue(&quot;data[body]&quot;,437934);" /> 

Answer 1

The editor itself is a DIV (may be another HTML element) or IFRAME set to contentEditable / designMode = on .
If the element is a DIV , you can use its InnerHTML property.
For best results with IFRAME use the code below:

 procedure TForm1.Button1Click(Sender: TObject); var editorDoc: OleVariant; range: OleVariant; id: OleVariant; begin id := 'editor'; // frame ID editorDoc := (WebBrowser1.Document as IHTMLDocument2).parentWindow.frames.item(id).Document; range := editorDoc.body.createTextRange(); // range.collapse(false); // if you need to append range.select(); range.pasteHTML('<b>Boo!</b>'); end; 

Notes:

• No errors to simplify the code.
• You can also try range.execCommand('inserthtml', false, MyText) (not tested with TEmbeddedWebBrowser , but had dummy results when I tried it with plain HTML / Javascript on IE ).

Answer 2

I have no experience with this TEmbeddedWebBrowser tool, but according to your post, I am thinking of a way to get form fields. When you know what fields it contains, I suppose you can fill them out, since that doesn't look like the purpose of your message.

• Assuming the form is declared and reachable: you can capture the form and .elements its collection .elements : easily if it is declared on your page (give it an id attribute, then use document.getElementById() ), it could be do if the form is declared / inside editor.js using document.forms then.

• Otherwise: you can get the script dump from the network - this one - and see what is printed when calling (after turning on editor.js naturally) dump(data) or dump(data[body]) . Since data[] used as an argument to rtevalue() called by your onclick submit button, it should contain the key / value pairs of the form. The bad thing about this method is that data[] should be populated with Javascript, so if your form has radio buttons or checkboxes, you can only see selected ones, so I would like to give the first option before trying this trick.

In the comments, you should not directly use innerHTML to insert the HTML subtree into the document as most of the time when it does not work (especially when forms are used), appendChild() redo the work to provide the correct document, for example:

 var dummyContainer=document.createElement("span"); var dummyContainer.innerHTML="..."; //insert stuff here, because it easy to use ;) myContainer.innerHTML=""; //clearing your "real" container doesn't add anything to the HTML tree, it'll work - you can also use removeChild() in a loop (but it not as easy to use!) myContainer.appendChild(dummyContainer); //appendChild will translate properly the text inserted by innerHTML in dummyContainer into a clean HTML subtree