Skip to content

Instantly share code, notes, and snippets.

@gauravv7
Created April 28, 2018 05:11
Show Gist options
  • Select an option

  • Save gauravv7/067b42f94543c1c761a11a4eb6d97956 to your computer and use it in GitHub Desktop.

Select an option

Save gauravv7/067b42f94543c1c761a11a4eb6d97956 to your computer and use it in GitHub Desktop.
django-easy-select2==1.4.0 | adding image in options tags
# // https://github.com/asyncee/django-easy-select2/tree/master/sampleproject
# sampleproject/demoapp/admin.py
from django.contrib import admin
from django.db import models
from easy_select2 import Select2
from easy_select2.widgets import SELECT2_WIDGET_JS
from .models import Note, Category
class CustomSelect2(Select2):
class Media:
js = SELECT2_WIDGET_JS
js.append('js/custom_select2.js') # adding above js file to take effect
class NoteAdmin(admin.ModelAdmin):
formfield_overrides = {
models.ForeignKey: {'widget': CustomSelect2()}, # custom override for any usecase
models.ManyToManyField: {'widget': CustomSelect2()}, # custom override for any usecase
}
admin.site.register(Category)
admin.site.register(Note, NoteAdmin)
// https://github.com/asyncee/django-easy-select2/tree/master/sampleproject
// sampleproject/sampleproject/static/js
(function ($) {
"use strict";
function formatState (state) {
// function to be used for creating markup with image for option tags
console.log('being called');
var baseUrl = "http://lorempixel.com/4/4/";
var $state = $(
'<span><img src="' + baseUrl + '" class="img-flag" /> ' + state.text + '</span>'
);
return $state;
};
function redisplay_select2($el){
// overrided
var obj = $el.data();
obj.templateSelection = formatState; // simply adding to select2 constructor properties
if($("#" + $el.attr('id')).hasClass("select2-hidden-accessible")){
$("#" + $el.attr('id')).select2('destroy').select2(obj);
} else{
$("#" + $el.attr('id')).select2(obj);
}
}
function add_select2_handlers(){
// overrided
$('div.field-easy-select2:not([id*="__prefix__"])').each(function(){
var obj = $(this).data();
obj.templateSelection = formatState; // simply adding to select2 constructor properties
redisplay_select2($(this));
$("#" + $(this).attr('id')).on('DOMNodeInserted', function(){
$(this).select2('destroy').select2(obj);
})
});
}
$(function(){
add_select2_handlers();
});
}(jQuery || django.jQuery));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment