How to include jquery.js in Grails?

ⅰ亾dé卋堺 提交于 2019-12-20 12:07:09

问题


I have a Grails 2.0.0 project that was created using grails create-app. In my HTML and GSP files, I'm trying to include jquery.js. I've tried all of the following without success:

<script type="text/javascript" src="jquery/jquery-1.7.1.js"></script>
<script type="text/javascript" src="jquery/jquery.js"></script>
<g:javascript library="jquery"/>

The first two <script> tags results in 404 Not Found (verified with Firebug). The <g:javascript>tag results in nothing being included (verified using view source).

On my Grails application's home page, it indicates that jquery 1.7.1 is installed (under "INSTALLED PLUGINS").

What is the correct way in Grails to include the jquery .js file?

Follow-up: The .GSP file:

<%@ page contentType="text/html;charset=UTF-8" %>
<html>
  <head>
    <title>Test</title>
    <g:javascript library="jquery/jquery"/>
  </head>
  <body>
    <h1>Test</h1>
  </body>
</html>

Results in the follow HTML source:

<html>
  <head>
    <title>Test</title>

  </head>
  <body>
    <h1>Test</h1>
  </body>
</html>

Note the lack of jquery.js being included.

Follow-up 2:

I'm creating my app using grails create-app:

13:56:40 ~/grailsDev $ grails create-app helloworld
| Created Grails Application at /Users/steve/grailsDev/helloworld
13:56:57 ~/grailsDev $ cd helloworld/
13:57:06 ~/grailsDev/helloworld $ ls -al web-app/js
total 8
drwxr-xr-x  3 steve  staff  102 Jan 21 13:56 .
drwxr-xr-x  7 steve  staff  238 Dec 15 08:04 ..
-rw-r--r--  1 steve  staff  183 Dec 14 22:56 application.js
13:57:23 ~/grailsDev/helloworld $ grails -version

Grails version: 2.0.0

回答1:


Apparently <r:layoutResources/> needs to be included in <head> (after <q:javascript library='jquery' />). The following actually works:

<%@ page contentType="text/html;charset=UTF-8" %>
<html>
  <head>
    <title>Simple GSP page</title>
    <g:javascript library='jquery' />
    <r:layoutResources/>
  </head>
  <body>
    Place your content here
  </body>
</html>



回答2:


The jquery plugin is installed by default in 2.0 - see grails-app/conf/BuildConfig.groovy. To use jquery.js in a GSP just add this line:

<g:javascript library='jquery' />



回答3:


Steve after installing Jquery plugin thru grails install-plugin jquery you have to execute another grails command to download the jquery file in your app

grails installJQuery

This target downloads and installs jquery-1.7.1.js and jquery-1.7.1.min.js under web-app/js/jquery/




回答4:


In grails 2.x you can also do:

grails.resources.modules = {
    core {
        dependsOn 'jquery, jquery-ui'
    }
}

in Config.groovy

Then in your GSP simply place the following in your HEAD element:

<r:require module="core"/>

The advantage is you can specify other CSS/JS files to depend on, makes it nice and clean in the GSP. This is also where you can override the versions of jQuery/jQuery-UI.




回答5:


As per the current docs - http://grails.org/plugin/jquery (Grails version: 1.3 > *) on 18th Sept, 2015


Installation

To install the jQuery plugin type this command from your project's root folder:

grails install-plugin jquery

Targets:

grails installJQuery
  • This target downloads and installs jquery-1.4.2.js and jquery-1.4.2.min.js under web-app/js/jquery/

The complete jQuery distribution is downloaded and installed under your project's /web-app/js/jQuery folder.


Usage

Ajax via jQuery

To have the Grails' adaptive AJAX support adapt itself to jQuery (rather than the default of Prototype, or another choice like YUI or Dojo):

Since Grails 1.2:

Add this line to your layout-file

<g:javascript library="jquery" plugin="jquery"/>

and the following to your grails-app/conf/config.groovy

grails.views.javascript.library="jquery"

alternatively you can use:

<g:javascript library="jquery" />

(without plugin="jquery") but you will need to call the grails installJQuery target (see Installation Tab)




回答6:


I saw a good tutorial on that in icodeya. http://www.icodeya.com/2012/09/grails-different-ways-to-import.html

you can either do this in your gsp:

<g:javascript src="myscript.js"/ >

OR you can do this in your Config.groovy:

grails.resources.modules = {
core{
resource url:'/js/jQuery.js' 
} 
myScript { 
resource url:'/js/myScript.js' 
dependsOn 'core' 
}
}

then, in your gsp, you can attach this:

<r:require module="myScript" />



回答7:


<g:javascript library="jquery/jquery"/>




回答8:


I found (from the JQuery Plugin page) that in addition to using the <g:javascript library="jquery"/> tag, I had to add the plugin label explicitly to make the tag look like:

<g:javascript library="jquery" plugin="jquery"/>

Any idea why I had to use the plugin property?




回答9:


Currently, in 2015, all you have to do is add runtime ":jquery:1.11.1" to your BuildConfig.groovy, and that is all.




回答10:


Update for Grails 2.3 This might help troubleshoot the configuration of jQuery so it can be available from your gsp pages.

  1. First of all if you run the grails install-plugin jquery command it will fail with the 'install-plugin' obsolete message:

So most likely you already have it configured in your BuildConfig.groovy like this (note is runtime, not compile):

plugins {
    // ... some other plugins here ...
    runtime ":jquery:1:11:1"
}
  1. If you are using Eclipse, do a File search for jquery and see if you already have the files:

  2. Confirm that your js directory is not empty, it is located inside the web-app directory. If js has no files or directories then just copy them from what you got in in step 2:

  3. As mentioned before, the combination of these two lines seems to work (at the top of your gsp pages):

If jQuery is not the very first javascript library to load you might have problems. Check your layouts/main.gsp file if you have one. You might need to add jquery to all your pages just so it is at the very top of your html source.

Hope that helps.

Note: At the time of this posting (April 2015) Grails 3.0 has been released and it appears to be incompatible with Grails 2.X projects in the way they are configured. Hopefully it will be better documented to avoid the issues with 2.X.



来源:https://stackoverflow.com/questions/8956799/how-to-include-jquery-js-in-grails

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!