jquery - 使用 jQuery-Ajax、REST API 和 Neo4j GraphDB 实现 VisualSearch.js

Question

我正在尝试实现 VisualSearch.js使用 jQuery-Ajax、REST API 和 Neo4j GraphDB link ，它使用 Ruby 实现了相同的功能。

这是我的代码。

var visualSearch;      

$(document).ready(function() {
var facets=[];
$.ajax("/facets", {
    type:"GET",
    dataType:"json",
    success:function (res) {
        facets = res;
    }
});

      visualSearch = VS.init({
      container  : $('#search_box_container'),
      query      : '',
      showFacets : true,
      unquotable : [
        'text',
        'account',
        'filter',
        'access'
      ],
      callbacks  : {
        search : function(query, searchCollection) {
          var $query = $('#search_query');
          var count = searchCollection.size();
      $query.stop().animate({opacity : 1}, {duration: 300, queue: false});
          $query.html('<span class="raquo">&raquo;</span> You searched for: ' +
                  '<b>' + (query || '<i>nothing</i>') + '</b>. ' +
                  '(' + count + ' node' + (count==1 ? '' : 's') + ')');
          clearTimeout(window.queryHideDelay);
          window.queryHideDelay = setTimeout(function() {
            $query.animate({
              opacity : 0
            }, {
              duration: 1000,
              queue: false
            });
          }, 2000);
        },

    valueMatches : function(facet, searchTerm, callback) {
    alert(facet)        
    var restServerURL = "http://localhost:7474/db/data";
    $.ajax({
            type: "POST",
        contentType: "application/json; charset=utf-8",
            url: restServerURL,
            dataType: "json",
            contentType: "application/json",
        data: { /*Query goes here.*/ },
            success: function( data, xhr, textStatus ) {
                alert(data.self);
            },
            error: function(jqXHR, textStatus, errorThrown) {
            alert(jqXHR);  
            alert(textStatus);                  
            alert(errorThrown);
            },
            complete: function() {
                alert("Address of new node: " + data.self);
            }
    });     
    },
        facetMatches : function(callback) {
        if(visualSearch.searchBox.value() != "") {
        $.ajax("/connected_facets", {
                 type:"POST",
                 dataType:"json",
                 data: {/*Query goes here.*/},
                 success:function (res) {
                    callback(res);
                }
        }); 
        } else { 
                callback(facets);
            }
         }
      }
    });
  });

如果有人能指出这个问题，那将是一个很大的帮助。预先感谢:-)

Answer 1

我认为问题出在 valueMatches 上。您不使用传递给此函数的回调。如果您挖掘 VisualSearch 源代码 ( visualsearch.js:696 )，您将看到此回调(代码中的第 701-727 行)提供了从 valueMatches 到 jQuery 自动完成的过滤建议数据，VisualSearch 是在此基础上构建的(请参阅 visualsearch.js:1043 )。

所以在你的情况下它看起来像:

        valueMatches: function(facet, searchTerm, callback) {
            var restServerURL = "http://localhost:7474/db/data";
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: restServerURL,
                dataType: "json",
                data: {facet: facet, query: searchTerm},
                success: function(data) {
                    callback(data);
                }
            });
        },

此代码假设您的应用程序在上述网址接收 facet 和 query POST 变量，并以 JSON 数组形式提供答案，因此它会直接传递给回调(参见成功选项)。

与facetMatches相同。但是，如果您有一组固定的方面，您甚至可以直接在代码中传递它们:

        facetMatches: function(callback) {
            callback([
                {label: 'facet1', category: 'cat1'},
                {label: 'facet2', category: 'cat1'},
                {label: 'facet3', category: 'cat2'},
                {label: 'facet4', category: 'cat2'},
                {label: 'facet5', category: 'cat2'}
            ]);
        },