Pasar Imagen con Ajax

[miguelalexep]

Buenos dias, la duda que tengo es por un problema que me arroja ajax, lo que quiero hacer es pasar una imagen, pero me arroja el siguiente error. <ImageFieldFile: bancos_central/014_1.png> is not JSON serializable.

Lo que tenia pensado hacer es lo siguiente. Guardar en una variable el url y luego en la plantilla, mas exacto en el javascript, concatenarla con el resto del url que en este caso seria bancos_central/014_1.png, para despues introducirlo en un <img>. El codigo que manejo es el siguiente.

AJAX

Código Python:

def banco_autocomplete(request):
    q = request.GET['term']
    for term in q.split(" "):
        banco = []
        banco = CatalogoBanco.objects.using("central")
        banco = banco.filter(
            Q(concepto__icontains=term) | Q(clave__icontains=term)
        )
    bancos = []
    url = "http://localhost:8000/upload/undefined"
    for b in banco:
        bancos.append({
            'label':"%s %s" % (b.clave, b.concepto),
            'value':b.clave,
            'nombre':b.concepto,
            'imagen':b.imagen
            });
    return json_response(bancos)
 

JAVASCRIPT

<script>

Código Javascript:

$( "#id_banco2" ).autocomplete({
        source:"/ajax/banco_autocomplete/",
        select:function(event, ui){
            url = "http://localhost:8000/upload/" 
            $("#concepto").html(ui.item.nombre);
            $("#imagen2").prop("src",url+ui.item.imagen);
        }
    });
 

</script>