2017-07-06 29 views
0

我試圖在從選擇列表中刪除項目後更新數組中的值。爲此,我需要attr('name')作爲列表。在item_remove事件$item可以得到選擇列表,但它不能找到我需要的attr('name')是否有可能從剛剛從列表中刪除的項目中獲取選擇列表的名稱

下面的解決方案是我如何爲item_add事件做到這一點。你會看到var thisSelect得到選擇列表,並從中,我可以用實際的列表值填充值數組。

/** 
* 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); 
     }); 
    }); 

下面是我目前針對item_remove事件的解決方案。在控制檯中會發生一個Cannot set property 'values' of undefined錯誤,因爲無法填充值數組,因爲列表的名稱返回爲未定義。

/** 
* 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); 
     }); 
    }); 

附件是我試圖讓名「additionalWork」從

html

回答

0

感謝您的回覆,我管理的解決方案,拿出參與獲得$輸入,而不是$項目。爲此,我可以得到列表中的值。

/** 
* 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); 
     }); 
    }); 
2

選擇元素你需要把它刪除,以獲取對象。我建議解析函數到onDelete回調

演示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); 

} 
相關問題