Est-il possible d'obtenir le nom d'une liste de sélection à partir d'un élément qui vient d'être retiré de cette liste?

Question

Je tente de mettre à jour les valeurs dans un tableau après qu'un élément a été supprimé d'une liste de sélection. Pour ce faire, j'ai besoin de attr('name') pour la liste. Sur l'événement d'un item_remove le $item peut avoir la liste de sélection, mais il ne peut pas trouver le attr('name') dont j'ai besoin.

La solution ci-dessous est ce que je fais pour un événement item_add. Vous verrez que le var thisSelect obtient la liste de sélection et à partir de là, je peux remplir le tableau de valeurs avec les valeurs de liste réelles.

/** 
* Add callback behaviour once a select element has been selected. 
*/ 
    $('[data-type="select"]').each(function(i, v) { 
     v.selectize.on('item_add', function (value, $item) { 
      var thisSelect = $item.parents('.controls').find('select'), 
       name = thisSelect.attr('name'), 
       values = [], 
       exclusiveSelected = thisSelect.find('option[data-exclusive="true"]:selected'); 

      if (exclusiveSelected.length) { 
       values.push({ 
        "value": exclusiveSelected.val(), 
        "label": exclusiveSelected.text().trim(), 
        "label-key": exclusiveSelected.attr("label-key") 
       }); 

       thisSelect.val(exclusiveSelected.val()).trigger('change'); 

      } else { 
       thisSelect.siblings('.selectize-control').find('.item').each(function(i, v) { 
        values.push({ 
         "value": $(v).data('value'), 
         "label": $(v).text().trim(), 
         "label-key": $(v).attr("label-key") 
        }); 
       }); 
      } 

      setMultipleFieldValues(name, values); 
      validate(documentId, name, fields); 
     }); 
    }); 

ci-dessous est ma solution actuelle pour un événement item_remove. Une erreur Cannot set property 'values' of undefined se produit dans la console car le tableau de valeurs ne peut pas être rempli en raison du nom de la liste renvoyée comme non défini.

/** 
* Add callback behaviour once a select element has been unselected. 
*/ 
    $('[data-type="select"]').each(function(i, v) { 
     v.selectize.on('item_remove', function (value, $item) { 
      var thisSelect = $item.parents('.controls').find('select'), 
       name = thisSelect.attr('name'), 
       values = []; 

      thisSelect.siblings('.selectize-control').find('.item').each(function(i, v) { 
       values.push({ 
        "value": $(v).data('value'), 
        "label": $(v).text().trim(), 
        "label-key": $(v).attr("label-key") 
       }); 
      }); 

      setMultipleFieldValues(name, values); 
      validate(documentId, name, fields); 
     }); 
    }); 

Attaché est l'élément de sélection Je suis en train d'obtenir le nom « additionalWork » de

Answer 1

Merci pour vos réponses, la solution que je réussi à venir avec l'entrée impliqué obtenir de $ au lieu de l'élément $. Pour cela, je pourrais obtenir les valeurs dans la liste.

/** 
* Add callback behaviour once a select element has been unselected. 
*/ 
    $('[data-type="select"]').each(function(i, v) { 
     v.selectize.on('item_remove', function (value, $item) { 
      var thisSelect = this.$input, 
       name = thisSelect.attr('name'), 
       values = [], 
       exclusiveSelected = thisSelect.find('option[data-exclusive="true"]:selected'); 

      if (exclusiveSelected.length) { 
       values.push({ 
        "value": exclusiveSelected.val(), 
        "label": exclusiveSelected.text().trim(), 
        "label-key": exclusiveSelected.attr("label-key") 
       }); 

       thisSelect.val(exclusiveSelected.val()).trigger('change'); 

      } else { 
       thisSelect.siblings('.selectize-control').find('.item').each(function(i, v) { 
        values.push({ 
         "value": $(v).data('value'), 
         "label": $(v).text().trim(), 
         "label-key": $(v).attr("label-key") 
        }); 
       }); 
      } 

      setMultipleFieldValues(name, values); 
      validate(documentId, name, fields); 
     }); 
    }); 

Answer 2

Vous devez obtenir l'objet tel qu'il est supprimé. Je vous suggère l'analyse d'une fonction dans le onDelete rappel

Démo http://jsfiddle.net/uZmcD/91/

$(function() { 
    $('#select-name').selectize({ 
    plugins: ['remove_button'], 
    onDelete: function(values) { 
     item_remove_function($(this)); 
    } 
    }); 
}); 

function item_remove_function($this) { 

    var name = $this[0].$wrapper.siblings('select').attr('name'); 
    alert('select name = ' + name); 

}