[SOLVED] textarea "value" equivalent

[ober]

This is my AJAX handler function. Basically I'm passing this function 2 values as a string concatenated by "||". One value needs to go in a text box... the other needs to show up as the value of a textarea. The problem is, the "title" box is getting the value "undefined"... and that's obviously not how you fill a textarea's value.

 

Help?!

 

EDIT: Sorry, forgot the code:

 

function handleEditor()
{
if(http.readyState == 4)//Finished loading the response
{
	var vals = http.responseText;
	var vals2 = new Array();
	vals2 = vals.split('||', vals);
	document.getElementById('title').value = vals2[0];
	document.getElementById('news_text').value = vals2[1];
	document.getElementById('editor').style.display = "block";
} 		
}

[emehrkay]

Using ie?

 

i know that innerHTML doesnt work with ie, so you'll have to use value. I dont see why that wouldnt work in other browsers though.

 

 

you can try a few methods, or all of them

 

ele.innerHTML = vals2[1];

ele.data = vals2[1];

ele.appendChild(vals2[1]);

[nogray]

the textarea has to have Name and ID to get a value attribute

<textarea name="news_text" id="news_text" ...

Also, make sure your array vals2 have the values in it (you can use alert before hand)

[ober]

It's the fact that I'm using TinyMCE as an editor... if I use a regular textarea... it works fine.  Now what?

[obsidian]

i know that innerHTML doesnt work with ie, so you'll have to use value. I dont see why that wouldnt work in other browsers though.

 

Why's that? I use innerHTML in IE6 and 7 in multiple scripts just fine. IE only limits certain types of elements that you cannot user innerHTML on (like tables). You can use it on textareas without a problem, and this is, IMHO, the best way to adjust the "value" of a textarea field.

[ober]

Neither works with the editor... it's being completely ignored.

[obsidian]

It's the fact that I'm using TinyMCE as an editor... if I use a regular textarea... it works fine.  Now what?

 

Sorry, I missed that before... TinyMCE has some really funky attribute settings in their textarea. Here is a link to look at for some additional ideas:

 

http://blorum.org/forum.php?p=356

 

From reading some in the TinyMCE forums, it seems that you actually have to modify the content of the textarea through the tinymce object rather than your normal methods.

 

Here's a very interesting function I saw on this page on moxiecode's site:

function ajaxLoad() {
var inst = tinyMCE.getInstanceById('content');

// Do you ajax call here
inst.setHTML('HTML content that got passed from server.');
}

 

That should at least be modifiable to work with what you're after, I would think.

[ober]

Thanks obsidian... I'll give that a shot.

[emehrkay]

oh tinymce, ive used it and had the same issues. if you havent figured it out by time i get to work, i will look through some of my code

 

what i did was make it so that if you click on the textarea, it turned into a tinymce editor, maybe that would help you out

[ober]

Interesting... how did you do that?

[emehrkay]

alright it is kinda long. i actaully had to modify some of the tinymce code to get it to do ajax calls, it is in their wiki, i dont know if you need that part, but ill see if i can find it

 

 

i am using mootools, so the syntax may be kinda off, but this is my code to show the text editor. on load of the page, i replace every textarea with a div and set the html of that div to the textarea's content and then hide the textarea by doing diplay: none.

 

then onclick of that div i run this function. the tinymce command says make that textarea an mceEditor. you'll need to know the textarea's id

 

tinyMCE.execCommand('mceAddControl', false, obj.id);

 

		div.addEvent('click', function(event){
			div.setStyles({
				'display': 'none'
			});

			obj.setStyles({
				'display': 'block'
			});

			if(obj.getTag() == 'textarea') 
				tinyMCE.execCommand('mceAddControl', false, obj.id);
			else
				obj.focus();

		});

 

also in the declaration of the mceEditor in the head tag you have to tell it to only load certain textareas with mode: "exact"

 

here is mine as an example

 

tinyMCE.init({
	mode:									"exact",
	theme:									"advanced",
	plugins:								"fullscreen",
	theme_advanced_toolbar_align: 			"left",
	theme_advanced_path_location:			"bottom",
	theme_advanced_toolbar_location: 		"top",
	theme_advanced_buttons1:				"bold,italic,forecolor,,separator,justifyleft,justifyright,separator,bullist,separator,removeformat,image, fullscreen,separator,code",
	theme_advanced_buttons2: 				"",
	theme_advanced_buttons3: 				"",
	file_browser_callback:					'myImageBrowser'
});

[emehrkay]

*edit*

 

here is the wiki article

 

http://wiki.moxiecode.com/index.php/TinyMCE:Turn_tinyMCE_into_an_Ajax_editor

[ober]

Thanks obsidian... worked like a charm