おはこんちは!
今回は、jqueryのプラグインで上手く動かないかったので、多少修正したのをメモしておきます。
症状:onClickでクリックのイベントが返ってくるが、一度選んだoptionのvalueをかえさなくなるバグ。
初期値(element.easySelectBox(‘select’, val, true);を使用し初期値をセット)のままポストすると、値が入っていないバグ
細かいところでは、selectタグの方でoptionにselectedを設定すると、初期値の文字色がグレー表示になる。※こちらは修正していません。
バージョン Easy Select Box 1.0.7
該当の修正箇所 _click関数
function _click(e) {
var easySelect = $(this);//$(this) refers to easySelect element
var easySelectData = easySelect.data('easySelectData');
var selectObj = easySelectData.selectObj;
var displayer = easySelectData.displayer;
var dropdown = easySelectData.dropdown;
var options = easySelectData.options;
//alert($(e.target));
if($(e.target).get(0)==displayer.get(0) || $(e.target).get(0)==easySelect.get(0)){
if(dropdown.is(':visible')){
_close(dropdown, options.speed);
} else {
_open(dropdown, options.speed);
}
} else if($(e.target).is('.'+options.classNames.item)){//esb item is clicked
var index = dropdown.find('.'+options.classNames.item).index($(e.target));
_updateSelect(selectObj, index);
if(options.onClick!=null){
// 修正
//options.onClick.call(this, {'value':selectObj.val(), 'text':selectObj.find('option').eq(index).html()});
options.onClick.call(this, {'value':selectObj.find('option').eq(index).attr('value'), 'text':selectObj.find('option').eq(index).html()});
}
} else if($('.'+options.classNames.item).has($(e.target)).length>0){//cufon text fix. Will also detect if a descendant of esb item was clicked
var index = dropdown.find('.'+options.classNames.item).index($(e.target).parents('.'+options.classNames.item));
_updateSelect(selectObj, index);
if(options.onClick!=null){
// 修正
//options.onClick.call(this, {'value':selectObj.val(), 'text':selectObj.find('option').eq(index).html()});
options.onClick.call(this, {'value':selectObj.find('option').eq(index).attr('value'), 'text':selectObj.find('option').eq(index).html()});
}
}
e.stopPropagation();
}
該当の修正箇所 _updateSelect関数
function _updateSelect(selectObj, index){
var easySelect = selectObj.data('easySelect');
var easySelectData = easySelect.data('easySelectData');
var displayer = easySelectData.displayer;
var dropdown = easySelectData.dropdown;
var options = easySelectData.options;
//update easySelect
var selectedOption = selectObj.find('option').eq(index);
displayer.html(selectedOption.html());
displayer.css('color','#2c2e31');
//update select
selectObj.find('option').removeAttr('selected');
// 修正
//selectedOption.attr('selected','selected');
selectedOption.prop({selected:true});
if(dropdown.is(':visible')){
_close(dropdown, options.speed);
}
}
このプラグインを初めて使って思ったことは、プログラムには向いていない、プラグインだと思われます。
メンテナンスも大分されていないみたいですし・・・
謎の挙動が多すぎでしんどい・・・