<script type="text/javascript" data-author="Tony Partner">
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    var thisQuestion = $('#question{QID}');
     
    if($('.inserted-select', thisQuestion).length == 0) {
     
      // Column-specific classes
      $('tr.subquestion-list', thisQuestion).each(function(i) {
        $('th, td', this).each(function(i) {
          $(this).addClass('column-'+i);
        });
      });
       
      // Insert selects into column 1
      $('.answer-item.column-1', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select" multiple>\
      <option value="" selected>Please choose...</option>\
      <option value="option1">Option 1</option>\
      <option value="option2">Option 2</option>\
      <option value="option3">Option 3</option>\
      <option value="option4">Option 4</option>\
      </select>');
       
      // Listeners
      $('.inserted-select', thisQuestion).on('change', function(i) {
        if($(this).val() != '') {
          console.log($(this).val());
          $(this).closest('.answer-item').find('input:text').val($(this).val()).trigger('change');
        }
        else {
          $(this).closest('.answer-item').find('input:text').val('').trigger('change');
        }
      });
       
      // Returning to page
      $('.with-select input:text', thisQuestion).each(function(i) {
        var thisCell = $(this).closest('.answer-item');
        var inputText = $.trim($(this).val());
        if(inputText != '') {
          $('select.inserted-select option', thisCell).removeAttr('selected');
          var inputValues = inputText.split(',');
          $.each(inputValues, function(i, val) {
            $('select.inserted-select option[value="'+val+'"]', thisCell).attr('selected', true);
          });
        }
      });
       
      // Clean-up styles
      $('select.inserted-select', thisQuestion).css({
        'max-width': '100%'
      });
      $('.with-select input:text', thisQuestion).css({
        'position': 'absolute',
        'left': '-9999em'
      });
    }
  });
</script>

<script type="text/javascript" data-author="Tony Partner">
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    var thisQuestion = $('#question{QID}');
     
    if($('.inserted-select', thisQuestion).length == 0) {
     
      // Column-specific classes
      $('tr.subquestion-list', thisQuestion).each(function(i) {
        $('th, td', this).each(function(i) {
          $(this).addClass('column-'+i);
        });
      });
       
      // Insert checkboxes into column 1
      $('.answer-item.column-1', thisQuestion).each(function(i) {
        var column = 1;
        var row = i+1;
        $(this).addClass('with-multi-opt').append('<ul class="list-unstyled inserted-list">\
            <li class="question-item checkbox-item inserted-item">\
              <input type="checkbox" id="'+row+'_'+column+'_box1" value="option1">\
              <label for="'+row+'_'+column+'_box1" class="checkbox-label control-label">Option 1</label>\
            </li>\
            <li class="question-item checkbox-item  inserted-item">\
              <input type="checkbox" id="'+row+'_'+column+'_box2" value="option2">\
              <label for="'+row+'_'+column+'_box2" class="checkbox-label control-label">Option 2</label>\
            </li>\
            <li class="question-item checkbox-item  inserted-item">\
              <input type="checkbox" id="'+row+'_'+column+'_box3" value="option3">\
              <label for="'+row+'_'+column+'_box3" class="checkbox-label control-label">Option 3</label>\
            </li>\
          </ul>');
      });
       
      // Listeners
      $('.inserted-item :checkbox', thisQuestion).on('change', function(i) {
        var thisCell = $(this).closest('.answer-item');
        var values = [];
        $('.inserted-item :checkbox:checked', thisCell).each(function(i) {
          values.push($(this).val());
        });
        $('input:text', thisCell).val(values);
      });
       
      // Returning to page
      $('.with-multi-opt input:text', thisQuestion).each(function(i) {
        var thisCell = $(this).closest('.answer-item');
        var inputValues = $.trim($(this).val());
        if(inputValues != '') {
          console.log(inputValues);
          var prevValues = inputValues.split(',');
          $.each(prevValues, function(i, val) {
            $('.inserted-item :checkbox[value="'+val+'"]', thisCell).prop('checked', true);
          });
        }
      });
       
      // Clean-up styles
      $('.inserted-list', thisQuestion).css({
        'margin': '0',
      });
      $('.inserted-list li', thisQuestion).css({
        'margin': '5px 0 -5px 0',
        'padding': '0 0 0 20px',
        'text-align': 'left'
      });
      $('.with-multi-opt input:text', thisQuestion).css({
        'position': 'absolute',
        'left': '-9999em'
      });
    }
  });
</script>