Hi Matthew,
I updated the example on
http://code.xwiki.org/xwiki/bin/view/Modules/WysiwygEditorModule#HLoadondemandandshowsourcetext
. Some notes:
* the cache input works only if it is present on the page when the page
is loaded. It is used to preserve the editor content against browser
Back/Forward buttons. I don't think you need it since you load the
editor on demand.
* The inputURL I suggested is indeed not suited for you use case. If you
load the editor on demand only when creating new objects, thus their
WYSIWYG properties are empty, you can use an inputURL like this:
$xwiki.getURL("FakeSpace.FakePage", "edit",
"xpage=wysiwyginput&render=true&key=fake")
(of course it needs to be evaluated)
If you load the editor on demand also when objects are edited then
you'll have to edit wysiwyginput.vm template so that it works with an
URL like this:
$xwiki.getURL("Blog.BlogIntroduction", "edit",
"xpage=wysiwyginput&render=true&field=Blog.BlogPostClass_0_content")
That it, read the "field" request parameter and feed the WYSIWYG editor
with the corresponding value. I can help you with this if you need it.
Hope this helps,
Marius
On 08/26/2010 06:21 PM, Matthew Hildebrand wrote:
> Marius,
>
> Thanks for the info. That got me pointed in the correct direction, and
> I've got the wysiwyg editor appearing. However there are a few weirdness
> issues...
>
> 1) Some of the CSS stylings are not being attached to the wysiwyg editor
> (the specific one that I have noticed is that tables no longer have
> shaded backgrounds on the headers or borders (using Colibri skin).
>
> 2) If I switch to source view and add some text, I am then unable to
> switch back to wysiwyg view. I get a cross-domain error:
> (NS_ERROR_DOM_BAD_URI): Access to restricted URI denied
> code: 1012
> INDEX_SIZE_ERR: 1
> DOMSTRING_SIZE_ERR: 2
> HIERARCHY_REQUEST_ERR: 3
> WRONG_DOCUMENT_ERR: 4
> INVALID_CHARACTER_ERR: 5
> NO_DATA_ALLOWED_ERR: 6
> NO_MODIFICATION_ALLOWED_ERR: 7
> NOT_FOUND_ERR: 8
> NOT_SUPPORTED_ERR: 9
> INUSE_ATTRIBUTE_ERR: 10
> INVALID_STATE_ERR: 11
> SYNTAX_ERR: 12
> INVALID_MODIFICATION_ERR: 13
> NAMESPACE_ERR: 14
> INVALID_ACCESS_ERR: 15
> VALIDATION_ERR: 16
> TYPE_MISMATCH_ERR: 17
> result: 2152924148
> filename:
> http://10.10.2.233/xwiki/resources/js/xwiki/wysiwyg/xwe/5CB5F3FEC4B215F8
> 61E3FFD8E65C48BA.cache.html
> lineNumber: 4689
> columnNumber: 0
> inner: null
> data: null
> http://10.10.2.233/xwiki/resources/js/xwiki/wysiwyg/xwe/5CB5F3FEC4B215F8
> 61E3FFD8E65C48BA.cache.html
> Line 2791
>
>
> Here is my code:
> function makeWysiwyg(targetArea, randomKey) {
> cacheId = 'wysiwygCache' + randomKey;
> $('cacheArea').insert({ bottom: '<input type="hidden" id="' +
> cacheId + '">' });
> (function() {
> var field = document.getElementById(targetArea);
> if (field) {
> // Hide the element that will be wrapped by the WYSIWYG
> editor.
> field.style.visibility = 'hidden';
> // Show the loading animation.
> var loading = document.createElement('span');
> loading.className = 'loading';
> loading.style.display = 'block';
> loading.style.position = 'absolute';
> loading.style.width = field.offsetWidth + 'px';
> loading.style.height = field.offsetHeight + 'px';
> field.parentNode.insertBefore(loading, field);
> // Remove the loading animation after the WYSIWYG module has
> been loaded.
> Wysiwyg.onModuleLoad(function() {
> loading.parentNode.removeChild(loading);
> });
> }
> }).call();
>
> var wysiwygConfigNew = {
> hookId: targetArea,
> cacheId: cacheId,
> syntax: 'xwiki/2.0',
> displayTabs: true,
> defaultEditor: "wysiwyg",
> inputURL: 'javascript:parent.document.getElementById("' +
> targetArea + '").value',
> plugins: 'submit line separator embed text valign list indent
> history format symbol link image table macro import',
> menu: 'link image table macro import',
> toolbar: 'bold italic underline strikethrough | subscript
> superscript | unorderedlist orderedlist | outdent indent | undo redo |
> format | hr symbol',
> wiki: 'xwiki',
> space: 'ProjectManagement',
> page: 'UseCase-ForgotPassword',
> openofficeServerConnected:'false',
> debug: 'false'
> };
>
> Wysiwyg.onModuleLoad(function() {
> new WysiwygEditor(wysiwygConfigNew);
> wysiwygConfigjRSc = undefined;
> });
> }
>
>
>
> I am calling the makeWysiwyg function at the end of my
> Ajax.Request:onSuccess function, and passing a string representing the
> textarea that was just inserted and a random key generated via
> $util.generateRandomString(4) by the Ajax requested page (returned as a
> JSON object).
>
> Thanks!
>
> --Matthew
>
>
>
> -----Original Message-----
> From: users-boun...@xwiki.org [mailto:users-boun...@xwiki.org] On Behalf
> Of Marius Dumitru Florea
> Sent: Tuesday, August 24, 2010 3:34 AM
> To: users@xwiki.org
> Subject: Re: [xwiki-users] Enable wysiwyg editor for dynamically
> createdobjects
>
> Hi Matthew,
>
> On 08/13/2010 02:24 AM, Matthew Hildebrand wrote:
>> So I'm dynamically adding objects to the page via an ajax request (get
>
>> the document, create a new object of the specified type, return the
>> object in edit mode as a JSON object). What I am not able to figure
>> out, is how to get my textareas to become wysiwyg enabled (when
> appropriate).
>> I don't quite understand how the javascript that replaces the text
>> areas is being generated, let alone if there is a way to get it
>> generated (and returned as part of my JSON object).
>
> You can load the WYSIWYG editor on demand for a specific property by
> following
> http://code.xwiki.org/xwiki/bin/view/Modules/WysiwygEditorModule#HLoadon
> demandandshowsourcetext
> . Let me know if you have more questions.
>
> Hope this helps,
> Marius
>
>>
>>
>>
>> Any help would be greatly appreciated!
>>
>>
>>
>> Thanks,
>>
>>
>>
>> --Matthew
>>
>> _______________________________________________
>> users mailing list
>> users@xwiki.org
>> http://lists.xwiki.org/mailman/listinfo/users
> _______________________________________________
> users mailing list
> users@xwiki.org
> http://lists.xwiki.org/mailman/listinfo/users
> _______________________________________________
> users mailing list
> users@xwiki.org
> http://lists.xwiki.org/mailman/listinfo/users
_______________________________________________
users mailing list
users@xwiki.org
http://lists.xwiki.org/mailman/listinfo/users
