Question

我希望动态输入div中的数据时更新textField内容。我尝试过以下方法：

<g:formRemote name="changeText" on404="alert('not found!')" update="resultDiv"
    url="[ controller: 'results', action:'results' ]">
        <g:textField onChange="submit();" name="text"/>
</g:formRemote>

除了新页面之外，所有内容都有效，而div未更新...

def results = {
   render "new content"
}

Answer 1

以下GSP代码：

<g:formRemote name="changeText" on404="alert('not found!')" update="resultDiv"
          url="[ controller: 'results', action:'results' ]">

将使用onSubmit方法生成一个新的HTML表单：

<form id="form_id" action="/action" method="post" onsubmit="jQuery.ajax({type:'POST',data:jQuery(this).serialize(), url:'/action',success:function(data,textStatus){jQuery('#resultDiv').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){}});return false">

因此，将触发AJAX调用的Javascript代码位于onSubmit()方法。

这里的问题是您使用Javascript调用submit()操作，但这不会触发onSubmit()方法。

解决方案是直接在onSubmit()事件中调用onChange方法：

<g:textField onChange="this.form_id.onsubmit();" name="text"/>

Answer 2

Grails为此提供了一个很棒的标记：remoteField

<g:remoteField name="input" controller="results" action="results" onSuccess="jQuery('#resultDiv').html(data)"/>

<div id="resultDiv"></div>

调用remoteForm只用onChange事件更新一个div

2 个答案: