问题描述:

I have the following function

 $("[rel='srm-triage-select-queue']").select2({

placeholder: "Select Queue",

allowClear: true,

data: queueData,

maximumSelectionLength: 1,

formatResult: function (team) {

var piloticon = (this.element.attr("data-piloticon") == "show") ? true : false;

var txicon = (this.element.attr("data-txicon") == "show") ? true : false;

var teamname = team.queue_name;

if (txicon) {

if (team.using_transfer_queue === 1) {

teamname += '<i class="fa fa-fw fa-check-square-o pull-right txt-color-greenLight"></i>';

} else {

teamname += '<i class="fa fa-fw fa-square-o pull-right txt-color-greenLight"></i>';

}

}

if (piloticon) {

if (team.pilot_short !== null && team.pilot_short !== "") {

teamname += '<i class="fa fa-fw fa-phone pull-right txt-color-blueLight"></i>';

}

}

//console.log('queueData: ' + JSON.stringify(queueData, null, 2));

console.log('queueData:');

//Filter teams based on the Triage form selections

// try {

if ($(".triageFRTRadioBtn").is(':checked') &&

(teamname.indexOf("FRT") !== -1 || teamname.indexOf("PWx") !== -1 )) {

console.log('FRTTTTTTTTTTTTT');

return teamname;

} else {

return "";

}

},

initSelection : function (element, callback) {

var data = {id: element.val(), text: element.val()};

callback(data);

},

escapeMarkup: function (m) { return m; }

}).trigger('select2-is-ready');

and this is how i tie this to the HTML:

 <section class="col col-10" style="padding-right: 0px;">

<input rel="srm-triage-select-queue" id="triage_team" class= "triage_team" data-piloticon="show" style="width: 100%;"/>

</section>

The dropdown list get correctly rendered.

However, the problem is that when i use the following code snippet in formatResult() as shown in the above select2, the dropdown results are jittery when scrollbar is used. Looks like Select2 is probably repainting the dropdown maybe, not sure.

 if ($(".triageFRTRadioBtn").is(':checked') &&

(teamname.indexOf("FRT") !== -1 || teamname.indexOf("PWx") !== -1 )) {

console.log('FRTTTTTTTTTTTTT');

return teamname;

} else {

return "";

}

If I do not use the above id..else loop in the formatResult() code, and simply return the following in formatResult(), there is not jittery behavior.

return teamname;

Any thoughts on how to handle this?

相关阅读:
Top