django-unfold icon indicating copy to clipboard operation
django-unfold copied to clipboard

Add support for django-smart-selects

Open ethemce opened this issue 1 year ago • 3 comments

Hello, first of all thanks for this great admin panel.

After some experiments I realized that "django-smart-selects" / "ChainedForeignKey" does not have any effect on the admin panel. is there any chance to make it compatible with your admin panel?

Thank You.

Example

class Media:
        js = [
            "smart-selects/admin/js/chainedfk.js",
            "smart-selects/admin/js/bindfields.js",
            "smart-selects/admin/js/chainedm2m.js",
        ]
product = ChainedForeignKey(
        Product,
        chained_field="company",
        chained_model_field="company",
        show_all=False,
        auto_choose=True,
        sort=True,
    )

ethemce avatar Nov 06 '23 08:11 ethemce

Just ran in to the same issue with smart selects - this would be a really worthwhile addition to this fantastic upgrade to the admin console

mikehowarth-lab avatar Dec 23 '23 10:12 mikehowarth-lab

Ok spent a little more time looking at this today and managed to hack this together to get this working.

Observations:

  • Jquery Ajax needs to be installed
  • Unfold currently omits the classes and data attributes required for smart select to function.
  • Additional js file needed to add appropriate data attributes

Issues:

  • Data Value is currently hard coded - need to be able to overide this with the departure id so it is pre-selected.

Admin Model Media Class

    class Media:
        js = [
            "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js",
            "smart-selects/admin/js/chainedfk.js",
            "smart-selects/admin/js/bindfields.js",
            "smart-selects/admin/js/chainedm2m.js",
            "js/booking-admin.js"
        ]
// booking-admin.js

const $ = django.jQuery;

$(function() {
    $('select[name="departure').attr('id', 'id_departure');
    $('select[name="departure').attr('data-chainfield', 'trip');
    $('select[name="departure').attr('data-auto-choose', 'true');
    $('select[name="departure').attr('data-url', "/chaining/filter/trips/Departure/trip/bookings/Booking/departure")
    $('select[name="departure"]').attr('data-value', '1');
    $('select[name="departure').attr('data-empty-label', "--------"),
    $('select[name="departure"]').addClass('chained-fk');
});

Need to have more of a think how I can deal with matching the data-value to match the id set in the departure object.

mikehowarth-lab avatar Dec 23 '23 22:12 mikehowarth-lab

@lukasvinclav Smart select is something like django-autocomplete-light which i mentioned here (closed), the problem is just the style, which is not match with unfold Thank you for your hard working for such great project.

Biftor avatar Jan 03 '24 00:01 Biftor

For third party application integration you can contact us here https://unfoldadmin.com/

lukasvinclav avatar Jul 05 '24 10:07 lukasvinclav

Hello. Thank you for the wonderful admin panel.

It would be great adding this extension that was asked above

KarimovMurodilla avatar Aug 05 '24 11:08 KarimovMurodilla

Amazing admin panel! the smart-selects integration would be amazin. thanks a lot!

hernansaa avatar Aug 18 '24 21:08 hernansaa