CODEWITHSUNDEEP
jquery-select2
ramkumarn
ramkumarn

Reputation: 11

Select2 JSON Format for tree structure using ajax

I am trying to develop tree structure using jquery select2 plugin with ajax call that returns json format.I implemented it using struts 2.

my code is as follows

In script section

   <script>
    $(document).ready(function(){
      var id=1;
      $('#sub_lessons').select2({
   minimumInputLength: 3,
   maximumSelectionSize: 1,
   multiple: true, 
   ajax: {
     url: 'getData.action?lid='+id, 
     dataType: 'jsonp',
     quietMillis: 100,
     data: function(term, page) {
       return {
         q: term,  
         page_limit: 10,
         page: page
       };
     },
     results: function(data, page) {
       return {
         results: data,
         more:false
       };
     }
   },
   formatResult: function(data) {
     return data.text;
   },
   formatSelection: function(data) {
     return data.text;
   },
   dropdownCssClass: "bigdrop",  
   escapeMarkup: function(m) {
     return m;
   } 
 });        
      });
   </script>

and in body part

 <select id="sub_lessons" class="form-control select2" multiple>
 </select>

Here the action is not being called . If The action calls it retuns the following json String

[{"children":[{"children":[{"children":[],"id":15,"text":"algebra 3"}],"id":3,"text":"one one one"}],"id":1,"text":"another ones"},{"children":[{"children":[],"id":14,"text":"ratios"}],"id":6,"text":"lesson one"},{"children":[],"id":8,"text":"one 1"},{"children":[],"id":12,"text":"algebra 2"},{"children":[],"id":13,"text":"lesson 2"},{"children":[],"id":16,"text":"lesson 232"}]

The action is not being called. json format displays in select box something like 

 1
   1.1
      1.1.1   
   1.2
      1.2.1
      1.2.2
   1.3
   1.4

Now i want to implement the same using select 2 plug in.

is it possible to possible to do so? if so please help me to implement this. I could not understand where I am doing wrong.

any help would be appreciated.

Upvotes: 0

Views: 4936

Answers (1)

holmes2136
holmes2136

Reputation: 487

It's seems like only the following style ,

http://jsbin.com/wicutoti/20/edit

and i found some topic related to how to customising select2's dropdown

https://groups.google.com/forum/#!msg/select2/S0b-JJJIFYY/il-MYOFdGusJ

it points to not support the tree structure at present

In that thread, about trees: "not yet, something im working on for 4.0". And then: "Support for trees has probably been shelved for 4.0", says Igor and Kevin, the main Select2 developers (it seems, looking at the GitHub stats).

Upvotes: 2

Related Questions