2015-04-23 74 views
2

我试图使x-editableselect2与远程搜索一起工作。X-editable和Select2与远程数据不能正常工作

这是带有模板的HTML。表格ID是“表格”。

<td> 
    <a href="#" id="{{ $template->id }}" data-value="{{ $template->food_item_id }}" name="food_item" data-type="select2" data-pk="{{ $template->id }}" data-title="" class="editable-click food_item"> 
     {{ $template->food_item_name }} 
    </a> 
</td> 

我使用选择设置X编辑

$('#table').editable({ 
     selector: 'tbody tr td .food_item', 
     url: '/update', 

     select2: { 
      cacheDataSource: true, 
      allowClear: true, 
      placeholder: 'Select food item', 
      width: '200px', 
      id: function (item) { 
       return item.id; 
      }, 
      ajax: { 
       url: '/json', 
       dataType: "json", 
       type: 'post', 
       data: function(term, page) { 
        return { 
        q: term 
        }; 
       }, 
       results: function(data, page) { 
        return { 
        results: data 
        }; 
       } 
      } 
     } 
    }); 

远程JSON是按以下格式:

[{"id":"1","text":"Jasmine Tea"},{"id":"2","text":"Green Tea"},{"id":"3","text":"Herbal Tea"},{"id":"4","text":"Tulsi Tea"},{"id":"5","text":"Chamomile Tea"},{"id":"6","text":"Mint Tea"},{"id":"7","text":"Ginger Green Tea"}] 

我只得到

无搜索结果

感谢任何帮助,使这项工作。

+0

一切都看起来不错,虽然http://jsfiddle.net/dhirajbodicherla/wQysh/457/检查远程请求是否正确返回数据 – Dhiraj

回答

1

您必须更改JSON。

记住创建对象导致

例子:

{"results":[{"id":145,"text":" CHECKER "},{"id":146,"text":" CHEROCKE"}, 
{"id":147,"text":" CHERY "},{"id":148,"text":" CHEVROLET "}, 
{"id":410,"text":" JINCHENG"},{"id":502,"text":" MARCHETTI "}, 
{"id":511,"text":" MATCHELSS "},{"id":664,"text":" SAIC CHERY"}, 
{"id":680,"text":" SCHEUERLE WABCO "},{"id":853,"text":" WINCHEMG"}]}