CODEWITHSUNDEEP
javascriptphpjquery-select2
Alexandre Elshobokshy
Alexandre Elshobokshy

Reputation: 10922

Select2 optgroup format using PHP

I've got an ajax call that get dynamic data and places them in select2 as follow :

$.ajax({
    type: 'get',
    url: '/api/?stuff='+c,
    dataType: "json",
    success: function (response) {
        // If select2 is already defined, we destroy it and rebuild it with the new data
        if(typeof $(".select2edit").data('select2') !== 'undefined') {
            $(".select2edit").select2('destroy').select2({ data: response, width: '100%', closeOnSelect: false });
        } else {
            $(".select2edit").select2({ data: response, width: '100%', closeOnSelect: false });
        }
    }
});

I create the response using PHP and then transform it to JSON before sending it :

$old_emplacement = '';
$results = array();
$i = -1;

while($array_campaign = tep_db_fetch_array($campaign)){
    if ($array_campaign['name'] != $old_emplacement) {
        $i++;
        $results['results'][$i]['text'] = $array_campaign['name'];
        $old_emplacement = $array_campaign['name'];
        $c = 0;
    }
    $results['results'][$i]['children'][$c]['id'] = $array_campaign['id'];
    $results['results'][$i]['children'][$c]['text'] = $array_campaign['c_name'];
    $c++;
}

$results['pagination']["more"] = true;

Thus resulting in the following JSON format :

{
  "results": [
    { 
      "text": "Name 1", 
      "children" : [
        {
            "id": 1,
            "text": "Text 1.1"
        },
        {
            "id": 2,
            "text": "Text 1.2"
        }
      ]
    },
    { 
      "text": "Name 2", 
      "children" : [
        {
            "id": 1,
            "text": "Text 2.1"
        },
        {
            "id": 2,
            "text": "Text 2.2"
        }
      ]
    }
  ],
  "paginate": {
    "more": true
  }
}

I get a No results found. when select2 initializes and loads. And I have no idea why. It's the correct format as far as the documentation is saying and other questions seem to confirm. Any ideas where could the problem be coming from?

It's also good to note that my select2 is inside a form which is inside a modal, and this is it's html :

<select name="xx[]" id="edit-xx" name='xx' class="form-control select2edit" multiple>
</select>

Upvotes: 0

Views: 1303

Answers (1)

Alexandre Elshobokshy
Alexandre Elshobokshy

Reputation: 10922

The problem was with the format generated by my PHP code. I'm posting the result here for anyone trying to generate a select2 optgroup format using PHP and for my own reference :

$old_emplacement = '';

$results = array();
$i = -1;

while($array_campaign = tep_db_fetch_array($campaign)){
    if ($array_campaign['name'] != $old_emplacement) {
        $i++;
        $results[$i]['text'] = $array_campaign['name'];
        $old_emplacement = $array_campaign['name'];
        $c = 0;
    }
    $results[$i]['children'][$c]['id'] = $array_campaign['id'];
    $results[$i]['children'][$c]['text'] = $array_campaign['c_name'];
    if(in_array($array_campaign['id'], $campaigns_array)) {
        $results[$i]['children'][$c]['selected'] = true;
    }
    $c++;
}

Upvotes: 2

Related Questions