1

i am trying to make checkboxSelectField sortable so far i have only managed with inclusion of third party scripts (sortable in jquery.ui).

The code looks like this:

Twig:

{% import "_includes/forms" as forms %}

    {{ forms.checkboxSelectField({
        label: 'Activate ?',
        id: 'activated',
        name: 'activated',
        options: options,
        values: values,
        class: 'sortable'
    }) }}

JS:

$(function() {
  Craft.initUiElements('.sortable');

  $('.sortable').find('.checkbox-select').sortable({
    axis: 'y',
    handle: '.checkbox-select-option',
    update: function(event, ui) {
      var values = [];
      $(this).find('input[type="checkbox"]').each(function() {
        if ($(this).is(':checked')) {
          values.push($(this).val());
        }
      });
      $(this).find('input[type="hidden"]').val(values.join(','));
    }
  });
});

i have seen that it is possible with garnish js in that case i don't need to load any other scripts how can i implement this ? unfortunately i can't find any documentation of Garnish JS

1 Answer 1

1

Here is the solution:

  var $rows = $('#YOUR_FIELD_ID')
    .children('.input .ltr').children('.checkbox-select').children();

  new Garnish.DragSort($rows, {
    axis: 'y',
    magnetStrength: 4,
    helperLagBase: 1.5,
    helperOpacity: 0.9,
  });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.