Array of string, removing one item - remove all

[osv]

I have collection with array of string with typehead:

 models: {
    type: Array,
    optional: true,
    autoform: {
      label: 'Compatible phone model names',
    }
  },

  'models.$': {
    type: String,
    min: 4,
    autoform: {
      type: 'typeahead',
      label: 'Model',
      afFieldInput: {
        typeaheadDatasets: {
          source: function (query, process) {
            Meteor.call('phones-typehead', query, function(err, res) {
              var items = _.map(res || [], mkLabelValue);
              process(items);
            });
          }
        }
      }
    }
  },

All work fine, but when I remove one item (click minus on array autoform) all items removed!

For spy autoform I use

AutoForm.addHooks(null, {
  before: {
    update: function(doc) {
      console.log(doc);
    }
  }
});

And I found $unset.models = "" in console log;

versions:

egrep -i "autoform|comerc" versions
aldeed:autoform@5.8.1
comerc:autoform-selectize@2.2.4
comerc:autoform-typeahead@1.0.3
comerc:bs-typeahead@1.0.2

My way

I decide to instantiate manually type head, here I remove comerc:autoform-typeahead and keep only comerc:bs-typeahead:

// schema..
  models: {
    type: Array,
    optional: true,
    autoform: {
      label: 'Compatible phone model names',
    }
  },

  'models.$': {
    type: String,
    min: 4,
    autoform: {
      type: 'text',
      // mark this input as typehead, we use .typehead-here class in
      // Template.afInputText_bootstrap3.onRendered to instantiate typehead
      afFieldInput: {
        class: 'typehead-here'
      }
    }
  },

Template.afInputText_bootstrap3.onRendered(function () {

  var source = function (query, process) {
    Meteor.call('phones-typehead', query, function(err, res) {
      var items = _.map(res || [], function mkLabelValue(it) {
        return {label: it, value: it};
      });
      process(items);
    });
  };

  var options = {
    highlight: true
  };
  var datasets = {
    source: source
  };

  this.$('.typehead-here').typeahead(options, datasets);

});

// Fix null array items
// https://github.com/aldeed/meteor-autoform/issues/840
AutoForm.addHooks(null, {
  before: {
    update: function(doc) {
      _.each(doc.$set, function(value, setter) {

        if (_.isArray(value)) {
          var newValue = _.compact(value);
          doc.$set[setter] = newValue;
        }
      });
      return doc;
    }
  }
});

server method (I keep it here to make example more full)

Meteor.methods({
  'phones-typehead': getPhoneModelsList,
});

function getPhoneModelsList(query) {
  // allow only admin and manager to use this method
  if (! Acl.isManagerById(this.userId) &&
      ! Acl.isAdminById(this.userId)) {
    return [];
  }

  var re = new RegExp(query, 'i');

  // Aggregate using `meteorhacks:aggregate`. 
  // Collection is small so it fast.
  var models = Products.aggregate([
    {$match: {'models.name': re }},    // Match query
    {$unwind: '$models'},       // Unwind array
    {                           // Group for uniqueness
      '$group': {
        _id      : '$models.name',
      }
    },
    {$project: {                // Add slug field for sorting
      models: 1,
      'slug': { '$toLower': '$_id' }
    }},
    {$limit: 10},               // Limit 10
    {$sort: {slug :1}},         // Sorting
    {$project: { _id: 1}}       // Only we need only one field
  ]);

  return _.pluck(models, '_id');
}

[thearabbit]

Thanks for your example. 1- how to custom template to show. 2- auto clear value if don't match the items list. Could example for me.

[Kabangi]

Experiencing the same issues

[marekhattas]

Same problem... check my fix,,, but also remeber that there is bug in aldeed/meteor-autoform package try this one: https://github.com/aldeed/meteor-autoform/issues/840#issuecomment-171633116