AJAX textarea problem (javascript newbie, alas)

I have a form which contains the following:

<textarea rows=10 cols=50 name='alias[fdrecipients]' id='alias_fdrecipients'> <%= render(:partial=>'recipients') -%> </textarea>

The recipients partial:

<%= @recipients.join("\r\n") -%>

And the submit button:

<input name='commit'        type='submit'        value='Add recipients'        onClick="new Ajax.Updater('alias_fdrecipients',                                  '/fdaddress/updtrecipients',                                  {insertion:Insertion.bottom,                                   asynchronous:true,
                                  evalScripts:false,                                   parameters:Form.serialize(this.form)}); return false;">

updtrecipients rebuilds the @recipients array.

This works fine as long as the textarea is in it's pristine state, i.e., nothing has been typed in it by the user. OTOH, if the user has typed or deleted anything in the textarea, it does not get updated when the button is clicked. Is there a better approach for this? I would like the user to be able to manually add or delete from the contents of the textarea as well as programmatically insert textarea content.

Thanks much

Ken