Vue集成select2插件,在选择时进行逻辑判断,确认则进行下一步,否则下拉框的值不变。
/**
* 承办方式
*/
function initContractingModeSelect() {
$('.contractingModeSelect').selectBindEx({
data : window['MORE/90000003/chr'],
placeholder : '请选择承办方式',
allowClear: false,
selected: vm.purchaseProject.contractingMode,
change: function(val){
vm.purchaseProject.contractingMode = val;
}
});
$('.contractingModeSelect').on("select2:selecting", function(e) { // select2选择中事件
var val = $('.contractingModeSelect').val(); //原本的值
var materialData = $('#materialGrid').bootstrapTable('getData');
if (materialData && materialData.length > 0) {
dialogConfirm("承办方式发生变更,已经存在的物资信息将会删除!", function(){
var ids = [];
$.each(materialData, function(idx, item) {
ids[idx] = item.id;
vm.purchaseProject.deleteMaterialIds.push(item.id);
});
$('#materialGrid').bootstrapTable('remove', {
field : 'id',
values : ids
});
dialogMsg('删除成功!', 'success');
}, function(){
//取消,回调
$('.contractingModeSelect').val(val);
$('.contractingModeSelect').trigger('change'); //动态改变值以后必须触发改变时间。否则将不会生效
});
}
});
}
原文链接:https://blog.csdn.net/jiangeeq/article/details/52457351