PDA

View Full Version : QWebView / QWebFrame create and edit content



Margit
9th November 2010, 00:02
QWebView / QWebFrame create and edit content

Hello,

I'm currently working on an C++/Qt project in which HTML5 documents shall be created. The Qt toolkit with the QWebView seems to me the perfect environment to implement such an editor.
The idea is to add, delete, move and rearrange elements in the document, while having the document open in a QWebView. Editing should be done directly in the QWebView if possible, and with additional GUI elements.
But: functionality I used to utilize in Java and JavaScript, like document.createElement, document.createElementNS, element.insertAfter, etc. is missing.
Workarounds can be implemented; for example creating an element:
- C++: create a JavaScript snippet with the appropriate code like


var el = document.createElementNS("...", "...");
containerElement.appendChild(el);
el.setAttribute("id", "new_element");

call frame->evaluateJavaScript
- QWebFrame: the script engine executes the script, the element is added to document
- C++: find the "new_element", set attributes, insert element below target parent element, ...
This is working, but I wonder if this is the recommended way; it would be much easier and faster, to have a QWebDocument::createElementNS() instead.
Its getting more complicated, when the element must be inserted at a certain location, say as the third child, or after another child.

Working with these restrictions I get the feeling, that I miss something. So here are some questions:
- Do I misuse the toolkit?
- Is it not designed for such tasks?
- Will the functionality be implemented in a future version? (I'm using WebKit2.0, included in Qt4.7 - in the 2.1 pages I found nothing about extending the base functionality)
- the evaluateJavaScript approach: is it a workaround, or the recommended way to do the tasks I specified?
- Or am I simply not aware of existing techniques?

The QDom module seems to have all the features I need - except the possibility to have a live view of the edited document - or am I wrong here?
I did not find a possibility to display a QDomDocument in QWebView (because they are completely unrelated?), except writing the document and read it with QWebView - and this is not an option, since I want to edit the document and see the changes live in the view.
So more questions:
- Is it possible with Qt to edit an HTML(5) document and see the changed in a Qt Widget?
- If so, what are the modules one would use?
- Can a QDomDocument be displayed in QWebView, or in another - without reparsing the whole document with setUrl, setContent, setHTML?

Can someone enlighten me?

regards,
Margit

ArmanS
13th November 2010, 19:06
I'm also developing a interactive HTML editor based on QtWebKit framework. And sees you are right, there is no direct way to manipulate HTML elements other than using evaluateJavaScript. QWebElement seems suitable for simple cases only. So you need to traverse internal DOM document via Javascript, find your interested element and insert/remove/replace/etc with it.
And I've no previous experience with QDomDocument and never have seen references of it in QtWebKit framework. Seems no direct connection between them.
Here is a good javascript reference page I've found very useful for me: http://help.dottoro.com/ljxsqnoi.php