Como você atualiza um campo de texto a partir de um Remotelink do Grails?
-
20-09-2019 - |
Pergunta
Marcação existente:
<g:textField name="identifier"/>
<g:remoteLink action="newId" update="identifier">generate new id</g:remoteLink>
Marcação HTML correspondente:
<input type="text" id="identifier" name="identifier">
<a onclick="new Ajax.Updater('guid','/webapp/domain/newId',{asynchronous:true,evalScripts:true});return false;" href="/webapp/domain/newId">generate</a>
A marcação HTML gera quando o link é clicado:
<input type="text" id="identifier" name="identifier">THE-NEW-ID-HERE</input>
<a onclick="new Ajax.Updater('guid','/webapp/domain/newId',{asynchronous:true,evalScripts:true});return false;" href="/webapp/domain/newId">generate</a>
Solução 3
Basta adicionar o seguinte ao remotelink:
onSuccess="\$('identifier').value=e.responseText;"
Então, o resultado final (que funciona perfeitamente):
<g:textField name="identifier"/>
<g:remoteLink action="newId" onSuccess="\$('identifier').value=e.responseText;">generate new id</g:remoteLink>
2 coisas a serem observadas:
- O $ deve ser escapar devido ao processamento 'Grails' desse atributo.
- Estou usando a biblioteca JavaScript do protótipo. Outras bibliotecas podem diferente sintaxe, mas a idéia básica é a mesma.
Outras dicas
Tentar
<div id="updatableArea">
<g:textField name="identifier"/>
</div>
<g:remoteLink action="newId" update="updatableArea">generate new id</g:remoteLink>
Em seu controlador, retorne o fragmento HTML
render(text:"<input type='text' id='identifier' name='identifier'>${newid}</input>", contentType:'text/html')
O Remotelink simplesmente atualizará o conteúdo do nó para não atualizar o "valor" do campo de texto.
Espero que ajude.
Outra maneira de usar o evento Onsuccess:
def getName = {
def exchange = Exchange.findById(params.id)
if (!exchange) {
render 'not found'
}
else {
render(builder: "json") {
exchange
}
}
}
...
<script>
function fillName(e) {
var obj = toJson(e);
$('name').value = obj.name;
}
function toJson(obj) {
return eval('(' + e.responseText + ')');
}
</script>
...
<g:remoteLink action="getName" id="1" onSuccess="fillName(e)">
Get
</g:remoteLink>
<input type='text' name='name' id='name'/>
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow