Grails

Question

单值自动完成工作正常（.) but when I tried the jQuery UI's multiple value example，它没有获得我需要的来源。

这是我的控制器。

def courseList = {
    def cList = Course.withCriteria {
        ilike 'course', params.term +'%'
    }
render (cList.'course' as JSON)
}

这是我的 _form 视图。

<div class="fieldcontain ${hasErrors(bean: studentInstance, field: 'courses', 'error')} required" >
<label for="course">
    <g:message code="student.courses.label" default="Courses" />
    <span class="required-indicator">*</span>
</label>
<g:textField name="course" id="coursetags" required="" value="${course?.course}"/>

这是我的 jQuery 脚本（完全来自 jQuery UI 演示）。

function split( val ) {
    return val.split( /,\s*/ );  
}

function extractLast( term ) {
    return split( term ).pop();  
}

var courses = ["English", "Music", "Science"];

$( "#coursetags" )
    // don't navigate away from the field on tab when selecting an item
    .bind( "keydown", function( event ) {
        if ( event.keyCode === $.ui.keyCode.TAB && $( this ).autocomplete( "instance" ).menu.active ) {
              event.preventDefault();
        }
    })
    .autocomplete({
        minLength: 2,
        source: function( request, response ) {
        // delegate back to autocomplete, but extract the last term
        response( $.ui.autocomplete.filter( courses, extractLast( request.term ) ) );
        },
        focus: function() {
            // prevent value inserted on focus
            return false;
        },
        select: function( event, ui ) {
            var terms = split( this.value );
            // remove the current input
            terms.pop();
            // add the selected item
            terms.push( ui.item.value );
            // add placeholder to get the comma-and-space at the end
            terms.push( "" );
            this.value = terms.join( ", " );
            return false;
        }
    });

当脚本中有 var courses 标记时，多值自动完成功能起作用。我如何将自动完成的源连接到我的控制器？

对于单个值，这是我在脚本中的值。

$("#coursetags").autocomplete({
    source: "/myApp/student/courseList",
    minLength: 2
});

提前致谢。

Answer 1

我找到了这个演示。 https://github.com/jquery/jquery-ui/blob/master/demos/autocomplete/multiple-remote.html

source: function( request, response ) {
    $.getJSON( "/myApp/student/courseList",
               {term: extractLast( request.term )},
               response );},

我替换了 source 部分，现在可以使用了。

Grails - jQuery 自动完成多个值

Grails - jQuery Autocomplete with Multiple Values

javascript

jquery-ui

jquery-autocomplete