0

这是解析返回到 ajax 自动完成调用的地图 json 的正确方法吗？我期待 jQuery 理解 json 响应，并且不需要在脚本中进行任何额外的工作来列出自动完成项目。

json -

[{"issue":"Item returned"}]

JS-

$("#term").autocomplete({
        source: function(request, response){
        $.ajax({
                url: '/issue/issue_type',
                type: 'POST',
                dataType: 'json',
                data: { issue_code : $("#term").val() },
                headers: { 'X-CSRF-Token': '<%= form_authenticity_token.to_s %>' },
                success: function(data) { response($.map(data.issue, function(issue){
                return {
                value: data.issue
                }
                } )); }
            });
        },
        minLength: 2,
        select: function(event, ui){ 
        //
                }
        });
        });

试过了success: function(data) { response(data); }。也没有用。

控制器 -

def issue_type
        @c = Codes.select("issue").where("codes.issue LIKE :i",{:i => "#{params[:posted_code]}%"})
        puts @c.to_json
        respond_to do |format|
        format.json { render :json=> @c.to_json }
        format.js
        end
        return @c.to_json
        end
4

1 回答 1

0

看起来您缺少的是将控制器返回的结果附加到下拉列表的 javascript

取自 JqueryUI 的示例；http://jqueryui.com/demos/autocomplete/#remote-jsonp

 #function to write 'selected: <selection>' in demo
function log( message ) {
        $( "<div/>" ).text( message ).prependTo( "#log" );
        $( "#log" ).scrollTop( 0 );
    }
 #when user selects from drop down passes selected value to log function
select: function( event, ui ) {
            log( ui.item ?
                "Selected: " + ui.item.label :
                "Nothing selected, input was " + this.value);
        },




  # i think this is CSS to make the drop down list appear/disappear
open: function() {
            $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
        }, 

 close: function() {
            $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
        }

这东西要么是空白的，要么是缺失的。日志功能不是必需的，但在选择时，javascript 应该会发生一些事情，以使选择出现在文本字段中。

而且看起来您的数据格式不正确，

data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: request.term
                },

成功看起来也不对。我只需从http://jqueryui.com/demos/autocomplete/#remote-jsonp复制并粘贴视图源并对​​其进行自定义以适合您的应用程序。

于 2012-05-04T04:16:55.150 回答