gpt4 book ai didi

jquery - Grails - jQuery UI 自动完成功能不起作用

转载 作者:行者123 更新时间:2023-12-01 05:35:51 25 4
gpt4 key购买 nike

我正在尝试在我的输入字段中使用 jQuery UI 自动完成功能。这是我在 Controller 中的代码。

import grails.converters.*

class SomeController {
def someClassList = {
def list1 = SomeClass.list()
def scList = []
list1.each {
scList.add(it.someClassAttribute)
}
render scList as JSON
}
}

我有这样的看法。

<head>
...
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
</head>
<script>
$(document).ready(function() {

var someTags = "${someClassList}";
$( "#tags" ).autocomplete({
source: someTags,
minLength: 2
});

});

</script>

但是当生成 gsp 代码时,它包括 <...autocomplete = "off"...>

<input type="text" name="someTitle" id="tags" required="" value="" class="ui-autocomplete-input" autocomplete="off">

我看了帖子Tokeninput Autocomplete not working in grails但这对我不起作用。请帮忙。提前致谢。

编辑这是我在 _form.gsp 中的 gsp 代码。

<g:textField name="someTitle" id="tags" required="" value="${someClassInstance?.someTitle}"/>

编辑 - 其他问题我将源更改为这个并且它有效。

source: "/myAppName/someControllerName/someClassList"

但是,整个自动完成列表都会显示,并且不会缩小范围。有任何想法吗?

最佳答案

不用担心添加为答案。对您有用的链接是: http://ohmiserableme.blogspot.co.uk/2011/08/grails-jquery-ajax-autocomplete-with.html

下载 http://www.grails.org 的 Grails 应用程序框架

创建 Grails 应用程序。

从 ( http://www.jquery.com ) 下载并安装 jQuery(将 JavaScript 文件复制到您的 grails 应用程序主 web-app/js 文件夹)

下载并安装 jQuery ui 插件

Create a domain class "City"

package myapp
class City {
String city
static constraints = {
city nullable:false, blank:false, maxSize:200
}
}

create controller
grails create-controller city
edit the CityController,
import grails.converters.*
add
def ajaxCityFinder = {
def citiesFound = City.withCriteria {
ilike 'city', params.term + '%'
}
render (citiesFound as JSON)
}

使用以下代码更新您的 gsp 文件:

<html>
<head>
<meta name="layout" content="main" />

<link rel="stylesheet" href="${resource(dir:'css/smoothness',file:'jquery-ui-1.8.14.custom.css')}" />

<g:javascript library="jquery.min" />
<g:javascript library="jquery-ui-1.8.14.custom.min" />
<g:javascript>
$(document).ready(function() {
$('#city').autocomplete({
source: '<g:createLink controller='city' action='ajaxCityFinder'/>'
});

});
</g:javascript>
</head>
<body>
<div class="demo">
<div class="ui-widget">
<label for="city">City: </label>
<input id="city">
</div>
</div>
</body>
</html>

虽然我还没有测试过这个,但我仍然认为如果你在每次按下一个键时在 Controller 中放置一个 println ,它就会被发送回以获得一个新列表,不是吗?

不幸的是,这就是ajax的工作原理。

查看 boselecta plugin在我的存储库中 - 看看我如何在该插件中完成自动完成。如 HTML 5 数据列表中所示。您可能会发现与它一起工作会更好。 Actual gsp doing the auto completereceives the dataList from websockets. 的组件

我最近在这方面做了一些工作,以便 dataList id/Element 是可选的,并且第一个 gsp 底部的 javascript 将标签转换为选定的值。

关于jquery - Grails - jQuery UI 自动完成功能不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34187412/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com