grails: onchange=${remoteFunction()

Question

I'm new to grails and I'm trying to insert another textfield element into a form when the first field is filled in. I'm trying the remoteFunction action to call a template but the template is not getting called. If I change the "g:textField" to a "g:select" option I will get a dropdown box, but do not want the dropdown box.

My idea is to have a name field and when it gets filled out, it should have another name field to be entered below the first one. I don't want to hard code several name fields into the form.

My View--

<tr class="prop">
<td valign="top" class="name">
<label for="casStudent_1"><g:message code="casawards.casStudent_1.label" default="Student #1" /></label>
</td>
<td valign="top" class="value ${hasErrors(bean: casawardsInstance, field: 'casStudent_1', 'errors')}">
<g:textArea onchange="${remoteFunction(action: 'create2' controller="casawards",
update: 'casStudent_2',
params: '\'timeName=\' + this.value')}"
name="casStudent_1" valueMessagePrefix="casawards.casStudent_1"
value="${casawardsInstance?.casStudent_1}" />
</td>
</tr>

controller --

def _create2 = { render (template:"create2") }

Template (create2) --

<tr class="prop">
<td  valign="top" class="name">
<label id = "casStudent_2" for="casStudent_2"><g:message    code="casawards.casStudent_2.label" default="Student #2" /></label>
</td>
<td valign="top" class="value ${hasErrors(bean: casawardsInstance, field: 'casStudent_2', 'errors')}">
<g:textField name="casStudent_2" value="${casawardsInstance?.casStudent_2}" />
</tr>

Any guidance will be appreciated.

Answer 1

The 'update' parameter in your remoteFunction should point to an existing DOM element. In your case, a call will be made to 'casawards/create2' and the response will be set as the content of and existing DOM element with id "casStudent_2". Are you sure that this element exists in your DOM?

Another issue is that onChange is called when you move the focus out of the textarea. Try clicking somewhere else in the page and see if the call is made.