Bilingual Textarea

Morning all, I am modifying a CMS for a client who requires content to be displayed bilingually, based on the users choice. I have a single <textarea> that I would like to use to contain both languages. What I have in mind is a selector above the box, for example 'Edit English / Edit French' which would toggle reading (and editing) from [eng][/eng] to [fr][/fr] tags between <textarea></textarea>.

To clarify the html would look something like this:

<a onclick="toggle(eng)">edit english</a> / <a onclick="toggle(fr)">edit french</a>
<textarea>
  [eng]This is the english section[/eng]
  [fr]Le bien[/fr]
</textarea>

Code (markup):

I'm after some clues as to how I might implement this, specifically the javascript to get content between tags, and to write between them. The user should not be able to see the french content while editing the english, and vice versa.

Thanks for reading,
Huw

 

Why not using different pages for each language. When the user makes his choice ('Edit English / Edit French') simply jump to the proper page. That method will be easier to mantain if later you want to add more languages.

 

As ajsa52 says. Besides your original solution won't work when JS is off. Different pages will.

 

I have a good reason for doing it this way, I don't really want advice on other solutions, I'd just like a pointer as to the code to implement what I outlined in my post. Thanks