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

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

普惠制代码如下：

<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()方法上。

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

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

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