Grails Ajax rendering list action - ajax

Question

Trying to render all the Contacts using ajax (This is a snippet)
So on click, it will list the contacts in a div on the update action. I have tested with a basic date function (see commented out render action Controller) to make sure ajax part could work and that does, but handling the list I have hit a wall with and going round in circles
GSP:
<g:remoteLink controller="event" action="showContacts" update="divContactList">Show Contacts!</g:remoteLink>
<div id="divContactList">Show contacts Here...
<g:each in="${contactList}" status = "i" var="contact">
<p>${contact.forname}</p>
<p>${contact.email}</p>
</g:each>
</div>
Controller:
def showContacts = {
def contactList = Contact.findAllByUser(lookupPerson())
// render "The time is now ${new Date()}"
render([contactList: contactList])
}
So overall it's not showing anything from the contactList in the web page, help on this would be appreciated

Answer 1

_templateName.gsp:
<g:each in="${contactList}" status = "i" var="contact">
<p>${contact.forname}</p>
<p>${contact.email}</p>
</g:each>
GSP:
<g:remoteLink controller="event" action="showContacts" update="divContactList">Show Contacts!</g:remoteLink>
<div id="divContactList">Show contacts Here...
<g:render template="layouts/templateName" model="[contactList: contactList]" />
</div>
Controller:
def showContacts = {
def contactList = Contact.findAllByUser(lookupPerson())
// render "The time is now ${new Date()}"
render(template: 'layouts/templateName', model:[contactList: contactList])
}

Answer 2

Clicking the remote link will send an AJAX call to the showContacts action, get an HTML answer and update the content of divContactList with the returned answer.
The showContacts action will render a template with the same name, passing it the contactList as part of the model.
If you would like the AJAX call to render the list of contacts you can try one of the following options:
Content Centric Ajax - Have the showContacts action render a template which displays the list of contacts
Data Centric Ajax - Have the showContacts action send a JSON/XML response representing the list of contacts and have a client side JavaScript code render this JSON/XML as the contact list