[AJAX] - Problema no remoteFunction
25/08/2010 00:00
<%@ page import="carteiro_veloz.ContatosLista" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="layout" content="main" />
<g:set var="entityName" value="${message(code: 'contatosLista.label', default: 'ContatosLista')}" />
<title><g:message code="default.create.label" args="[entityName]" /></title>
</head>
<body>
<div class="nav">
<span class="menuButton"><a class="home" href="${createLink(uri: '/')}"><g:message code="default.home.label"/></a></span>
<span class="menuButton"><g:link class="list" action="list"><g:message code="default.list.label" args="[entityName]" /></g:link></span>
</div>
<div class="body">
<h1><g:message code="default.create.label" args="[entityName]" /></h1>
<g:if test="${flash.message}">
<div class="message">${flash.message}</div>
</g:if>
<g:hasErrors bean="${contatosListaInstance}">
<div class="errors">
<g:renderErrors bean="${contatosListaInstance}" as="list" />
</div>
</g:hasErrors>
<g:form action="save" method="post" >
<div class="dialog">
<table>
<tbody>
<tr class="prop">
<td valign="top" class="name">
<label for="usuario"><g:message code="usuario.label" default="Usuario" /></label>
</td>
<td valign="top" class="value ">
<g:select id="usuario" name="usuario.id" from="${carteiro_veloz.Usuario.findAll(ativo:true)}" optionKey="id"
onChange="${remoteFunction(
controller:'usuario',
action:'ajaxGetContatos',
params:'\'id=\' + escape(this.value)',
onComplete:"updateContatos(e)")}" />
</td>
</tr>
<tr class="prop" style="display:none" >
<td valign="top" class="name">
<label for="contato"><g:message code="contatosLista.contato.label" default="Contato" /></label>
</td>
<td valign="top" class="value ${hasErrors(bean: contatosListaInstance, field: 'contato', 'errors')}">
<g:select name="contato.id" from="${carteiro_veloz.Contato.list()}" optionKey="id" value="${contatosListaInstance?.contato?.id}" />
</td>
</tr>
<tr class="prop" style="display:none">
<td valign="top" class="name">
<label for="lista"><g:message code="contatosLista.lista.label" default="Lista" /></label>
</td>
<td valign="top" class="value ${hasErrors(bean: contatosListaInstance, field: 'lista', 'errors')}">
<g:select name="lista.id" from="${carteiro_veloz.ListaContatos.list()}" optionKey="id" value="${contatosListaInstance?.lista?.id}" />
</td>
</tr>
<tr class="prop" style="display:none">
<td valign="top" class="name">
<label for="ativo"><g:message code="contatosLista.ativo.label" default="Ativo" /></label>
</td>
<td valign="top" class="value ${hasErrors(bean: contatosListaInstance, field: 'ativo', 'errors')}">
<g:checkBox name="ativo" value="${contatosListaInstance?.ativo}" />
</td>
</tr>
</tbody>
</table>
</div>
<div class="buttons">
<span class="button"><g:submitButton name="create" class="save" value="${message(code: 'default.button.create.label', default: 'Create')}" /></span>
</div>
</g:form>
</div>
<g:javascript>
function updateContatos(e){
alert("entrou no update")
var contatos = eval("(" + e.responseText + ")") // evaluate JSON
if (contatos) {
var rselect = document.getElementById('contato.id')
// Clear all previous options
var l = rselect.length
while (l > 0) {
l--
rselect.remove(l)
}
// Rebuild the select
for (var i=0; i < contatos.length; i++) {
var contato = contatos[i]
var opt = document.createElement('option');
opt.text = contato.name
opt.value = contato.id
try {
rselect.add(opt, null) // standards compliant; doesn't work in IE
}
catch(ex) {
rselect.add(opt) // IE only
}
}
$(".prop").fadeIn("slow")
}
}
var zselect = document.getElementById('usuario')
var zopt = zselect.options[zselect.selectedIndex]
${remoteFunction(controller:"usuario", action:"ajaxGetContatos", params:"'id=' + zopt.value", onComplete:"updateContatos(e)")}
</g:javascript>
</body>
</html>
def ajaxGetContatos = {
println "entrou aqui ajax"
println params.id
def usuario = Usuario.get(params.id)
if(usuario){
println "achou usuario" + usuario
}
render usuario?.contatos as JSON
}
Para se registrar, clique aqui.