How can I display multiple options names in the column?

How can I display multiple options names in the column?

alf007alf007 Posts: 36Questions: 14Answers: 0
edited August 2019 in Select


I have implemented a select field with the multiple property but I'm only getting the first name of the first option selected.

JS code:

                    label: "Fraccionamiento",
                    name: "promociones.idFraccionamientos",
                    type: "select",
                    placeholder: "Selección",
                    multiple: true,
                    separator: ','

PHP code:

Field::inst( 'promociones.idFraccionamientos' )
    ->validator( 'Validate::notEmpty',
    "message" => "Campo obligatorio"
    ->options( 'fraccionamientos', 'idFraccionamientos', 'nombre', function ($q) {
       $q ->where('fraccionamientos.estatus', 'Habilitado', '=');
    } )
    ->validator( 'Validate::dbValues' ),
    Field::inst( 'fraccionamientos.nombre' ),

The field idFraccionamientos is a VARCHAR field and it saves the data as:


The number is the primary ID of a table named fraccionamientos and I get the field nombre to display the name.

Hope you can help me out.


This question has an accepted answers - jump to answer


  • allanallan Posts: 52,268Questions: 1Answers: 7,958 Site admin
    edited August 2019 Answer ✓

    Its a bit trickier here since you aren't using referential integrity in the database. So what you need to do is use a renderer to split the integer string and then loop over the array looking up the label for each integer.

    The way to do the look up is to listen for the xhr event and assign the list of options to a variable that is scoped for both that event handler and the renderer - e.g.:

    var options = [];
    var table = $('#myTable')
      .on('xhr.dt', function (e, s, json) {
        options = json.options['promociones.idFraccionamientos'];
      } )
      .DataTable( {
        columns: [
            data: 'promociones.idFraccionamientos',
            render: function (data, type, row) {
              return data.split(',').map( function (val) {
                // ... look up the `val` from `options` to get the label
              }).join(', ');
      } );

    The look up is left as an exercise ;-)


  • alf007alf007 Posts: 36Questions: 14Answers: 0

    Thanks Allan!

Sign In or Register to comment.