我已經爲config.groovy添加了grails.views.javascript.library =「jquery」,安裝了插件並運行了「grails InstallJQuery」來獲取。 js文件到/ web-app/js中。Grails 1.3.3,JQuery 1.6.1.1,main.gsp
如果我添加<g:javascript library="jquery" plugin="jquery"/>
我的看法,代碼按預期工作:
search.gsp
...
<g:javascript library="jquery" plugin="jquery"/>
...
<div id="searchBox">
<g:remoteField
name="q"
update="peoplePanel"
paramName="q"
url="[controller:'user', action:'search']" />
</div>
<div id="peoplePanel"> <!-- ajax response will be placed in this div -->
</div>
resulting code:
...
<script type="text/javascript" src="/find-people/plugins/jquery-1.6.1.1/js/jquery/jquery-1.6.1.js"></script>
...
<div id="searchBox">
<input type="text" name="q" value="" onkeyup="jQuery.ajax({type:'POST',data:'q='+this.value, url:'/find-people/user/search',success:function(data,textStatus){jQuery('#peoplePanel').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){}});" />
</div>
<div id="peoplePanel"> <!-- ajax response will be placed in this div -->
</div>
,如果我從視圖中刪除<g:javascript library="jquery" plugin="jquery"/>
,添加<meta name="layout" content="main">
到視圖,並添加<g:javascript library="jquery" plugin="jquery"/>
到main.gsp,所生成的Ajax代碼是不同的,搜索字段中的自動完成功能不再有效:
main.gsp
...
<g:javascript library="jquery" plugin="jquery"/>
...
search.gsp
...
<meta name="layout" content="main">
...
<div id="searchBox">
<g:remoteField
name="q"
update="peoplePanel"
paramName="q"
url="[controller:'user', action:'search']" />
</div>
<div id="peoplePanel"> <!-- ajax response will be placed in this div -->
</div>
resulting code:
...
<script type="text/javascript" src="/find-people/plugins/jquery-1.6.1.1/js/jquery/jquery-1.6.1.js"></script>
...
<div id="searchBox">
<input type="text" name="q" value="" onkeyup="new Ajax.Updater('peoplePanel','/find-people/user/search',{asynchronous:true,evalScripts:true,parameters:'q='+this.value});" />
</div>
<div id="peoplePanel"> <!-- ajax response will be placed in this div -->
</div>
我不能控制封面下的處理方式。不使用layout/main.gsp似乎是唯一的選擇,但有明顯的缺點。