Xinha, Ajax, httpRequest object and innerHtml property

channis · 2008-07-05 17:56:59

Hi everyone, I'm trying to load Xinha in a textarea that is inserted inside a div element using an httprequest object and the innerHtml property (along with other elements). I'm not sure where/when to load xinha, or even if that's possible. Normally, xinha and all other javascript editors i've tested are loaded "after" certain page has finished loading. But when using ajax, the fact is that the page (the entire one) was loaded just once, and textarea elements are created "on the fly" via asynchronous calls. So, ¿is it possible to load xinha on a textarea that is created with an asynchronous call using an httpRequest object and the innerHtml property? (It is not possible, for functionality reasons, to create a popup and use xinha there)

the app is something like this...

there's a main page with menus designed using css, and each link make an asynchronous call modifying the center of the app, where some div elements can be found, so the contents of the divs are changed with the menu buttons dinamically using ajax. On of the divs will eventually load a textarea element (via the innerHtml property)...this works without issues. Now I want this textarea object to be loaded but with xinha attached to it. Of course the textarea is not there when the page is initially loaded....

Any help would be greatly appreciated, I'm sorry for not providing code samples but i think it could confuse even more the picture. I just need some kind of a "concept answer" here, or maybe some hints that i can use as a starting point to do more research.

Thanks for your time,
Channis

Tessa · 2008-08-26 12:56:30

Hi Channis,

Today I had the same problem I think. So I'll explain here my problem with the answer:

I have a static webpage where I update the contact dynamic with Prototype (Ajax.Updater)

Only when I'm loading a textarea into the webpage, Xinha doesn't load.

With help of Douglas I could fix it in this way:

HTML header:

<head>    
    <script type="text/javascript">
           _editor_url  = "Xinha_095/"  // (preferably absolute) URL (including trailing slash) where Xinha is installed
            _editor_lang = "en";      // And the language we need to use in the editor.
      </script>
      <script type="text/javascript" src="Xinha_095/XinhaLoader.js"></script>
      <script type="text/javascript" src="XinhaConfig.js"></script>
    
    <script type="text/javascript" src="prototype.js"></script>
</head>

Just like the newbie example...

When I activate the Ajax.Updater for loading the HTML page with the textarea I use the following javascript code:

function LoadEditor(pageid)
{
        //send Update request with post parameters and if completed, activate textarea id for Xinha
    new Ajax.Updater('content', 'edit_page.php', {
        method: 'post',
        parameters: {
            page: pageid
        },
        onComplete: function(response){
            if (response.status / 100 == 2) {
                var config = new Xinha.Config();
                editors = Xinha.makeEditors(['myTextArea'], config); //myTextArea = id of textarea where you want to use Xinha
                Xinha.startEditors(editors);
            }
            else
            {
                alert('Contact Admin, Xinha not loaded!');
            }
        }
    })
}

I hope that it works for you

If there are any questions just ask (but remember I'm just a newbie 2 javascript)

Last edited by Tessa (2008-08-27 05:41:47)

Xinha Discussion Forum

Announcement

#1 2008-07-05 17:56:59

Xinha, Ajax, httpRequest object and innerHtml property

#2 2008-08-26 12:56:30

Re: Xinha, Ajax, httpRequest object and innerHtml property

Board footer