如何将外部json数据添加到jQueryUI MultiSearch中

时间:2014-07-16 06:37:32

标签: javascript jquery json jquery-ui

根据jqueryUI MultiSearch。我在从外部链接导入json数据时遇到问题。这些示例仅在本地数据中进行了演示。在给出的例子中。有很多样本数据。我需要用ajax json源代替那些行。

这是示例json数据:

localData = [
         {"display_name": "Neal, Amelia R.","organization":"XYZ Company","primary_email":"pede@nibh.com","primary_phone":"(577) 324-9152"},
         {"display_name": "Cervantes, Colton Z.","organization":"XYZ Company","primary_email":"imperdiet.dictum.magna@SuspendissesagittisNullam.com","primary_phone":"(730) 491-0518"},
         {"display_name": "Thornton, Marvin H.","organization":"XYZ Company","primary_email":"tristique@in.ca","primary_phone":"(530) 962-1617"},
         {"display_name": "Watkins, Leilani C.","organization":"XYZ Company","primary_email":"amet.massa@a.edu","primary_phone":"(368) 554-4860"}];

嗯,正如你所看到的那样。我需要用这样的东西来补充这些界限:

$('input').multisearch({ajax: "test.json"});
or
$.getJSON( "test.json");

请建议。

1 个答案:

答案 0 :(得分:0)

您可以使用ajaxOptions,该插件提供了相应的选项。

Reference强调我的

  

ajaxOptions :对远程资源上的$ .ajax调用中使用的选项的哈希值。 仅在source是表示资源路径的字符串时使用。目前接受dataType和方法选项的覆盖。

实施例

$('input').multisearch({
    source: "test.json",
    ajaxOptions: {
        searchTerm: 'term', //Your querystring parameter
        dataType: 'json',
        method: 'GET'
    }
});

来自Plugin Source Code

     if ( typeof( opt.source ) == 'string' ) {

        opt.ajaxOptions =
           opt.ajaxOptions || {
              searchTerm: 'term',
              dataType: 'json',
              method: 'GET'
           };

        this._remoteSearch = _.throttle( function() {

              if ( self.localCache[self.search_text] ) {
                 cb( self.search_text, self.localCache[self.search_text] );
              } else {

                 if ( self._xhr )
                    self._xhr.abort();

                 self._xhr =
                    $.ajax({
                       url: opt.source,
                       data: opt.ajaxOptions.searchTerm+'='+self.search_text,
                       dataType: opt.ajaxOptions.dataType,
                       method: opt.ajaxOptions.method
                    }).done( _.partial( cb, self.search_text ) );
              }
           },
           opt.searchThrottle,
           { leading: false }
        );