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

Question

我正在尝试在后端使用jQuery-Ajax、REST API和Neo4j GraphDB实现VisualSearch.js。我已经阅读了此链接上的帖子，该链接已使用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);
                }
            });
        },

此代码假定您在上述 url 处的应用程序接收facet和查询POST 变量，并以 JSON 数组的形式提供答案，因此将其直接传递给回调（请参阅成功选项）。

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

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