I have been trying to use grails with the jquery-ui plug-in, I have created a simple controller along with a gsp page that uses a datepicker, I have not been able to get the date picker to show a list of dates. I have read the plug in documentation + articles on forums etc. but have not found a resolution.
Plug in documentation - http://grails.org/plugin/jquery-ui
Dev environment = grails 2.2.0, JDK 7, GGTS latest version
Any pointers to getting this working would be great.
(I have tried copying/renaming files in web app/other folders but have not been successful)
Steps 1. Created a new grails project
installed the jQuery-ui plug in
Created a controller and gsp page - per the documentation
When I navigate to the page it gives me the following error
ERROR resource.ResourceMeta - Resource not found: /plugins/jquery-ui-1.8.24/jquery-ui/themes/darkness/jquery-ui-1.8.24.custom.css | Error ERROR [/Test2].[default] - Servlet.service() for servlet [default] in context with path [/Test2] threw exception Message: It looks like you are missing some calls to the r:layoutR
The correct solution on 23-jan-13 that worked in my environment as described in the original post is shown below, I found the code posted on the grails website does not necessarily work as is - hence this edit. (if anyone has any edits do let me know directly)
GSP Code:
<html>
<head>
<title>Simple GSP page</title>
<g:javascript library="jquery" />
<g:javascript library="jquery-ui"/>
<script type="text/javascript">
$(document).ready(function() {
$("#datepicker").datepicker({dateFormat: 'yy/mm/dd'}); })
</script>
<r:layoutResources/>
</head>
<body>
<div>
<p> Between <input type="text" id="datepicker"> </p>
</div>
<r:layoutResources/>
</body>
</html>
Controller code:
def testDatePicker = {
}
Are you using the Resource framework? If yes, you should use the jquery-ui module like this:
<r:require module="jquery-ui"/>
Documentation on jquery-ui and resource framework.
Note - I incorrectly edited my original question along with providing the answer, the original question also has the solution description.
I finally was successful integrating jquery-ui and grails, faced some issue which allow the solution to runs. Steps.
- Create new Grails project (my environment grails 2.2.0, JDK 7, GGTS latest version)
- Install jquery-ui plug-in, edit BuildConfig add runtime ":jquery-ui:1.8.24".
- Create a controller and gsp page, using grails
GSP Page content
<html>
<head>
<title>Simple GSP page</title>
<g:javascript library="jquery" />
<g:javascript library="jquery-ui"/>
<r:layoutResources/>
<script type="text/javascript">
$(document).ready(function() {
$("#datepicker").datepicker({dateFormat: 'yy/mm/dd'}); })
</script>
</head>
<body>
<div>
<p> Between <input type="text" id="datepicker"> </p>
</div>
<r:layoutResources/>
</body>
</html>
Controller code:
def testDatePicker = {
}
4. Run the solution in grails, navigate to the date picker on your page, it should show you the sleek date picker
You need to add following line for plugin.
plugins {
runtime ":jquery:1.8.3"
compile ":jquery-ui:1.8.24"
}
And add the following line on which gsp page you use Jquery UI.
< head>
< g:javascript library="jquery" />
< r:require modules="jquery-ui"/>
< r:script>
$(document).ready(function() {
your code...
});
< /r:script>
< /head>
来源：https://stackoverflow.com/questions/14433710/grailsjquery-ui-integration-issue