-1

I am trying to implement Pillbox from Fuel UX. I've one issue while removing the item. Fuel UX has provided methods which we can use to get the details of the removed item. I want to get the ID of the removed item so that i can delete it from my database.

Below is the dummy code (Sorry, I am new with this Fuel UX) - 

// binding pills 
  $('#filterpills').pillbox('addItems', 0, [{
    text: 'facedbook.com',
    value: '1'
}]);

// remove pills
$('#filterpills').on('removed.fu.pillbox', function (item) {
    // do something
    alert('removed -value'+ $(item).data('value'));
    // want to get id of the deleted item here. 
    // while using item in alert its showing - {object}

});

Please help me get the deleted id or value (i.e 1 for facebook.com) so that I can delete this entry from the database as well.

Thanks in advance :)

cvrebert
  • 9,075
  • 2
  • 38
  • 49
Amod Vardhan
  • 29
  • 1
  • 3
  • 10

1 Answers1

0

You will need to store the database ID in a data-attribute. Are you able to duplicate the ID in data-id="databaseID". Then removed.fu.pillbox will return:

Object {text: "Item 1", value: "foo", id: "databaseID"}

I wouldn't recommend it, but you could store a copy of the the pill DOM elements separately and then use the data-value attribute (if unique) to then reference an index within that external store of DOM elements and update it from the pillbox everytime an event (add/remove) happens.

You could also make an issue request to have an event fired before the actual removal that catches the event and then searches the DOM for the node based on the data.

Interactive Llama
  • 780
  • 4
  • 10