1. 程式人生 > 實用技巧 >Django 後臺級聯選擇:django-smart-selects 包的使用

Django 後臺級聯選擇:django-smart-selects 包的使用

$ pip install django-smart-selects

以商品的 大類(水果)、小類(蘋果)、SKU(紅富士) 為例,大類是小類的外來鍵,大類和小類又同時都是SKU的外來鍵

# 大類
class GoodsCategory(models.Model):
    pass
# 小類
class GoodsType(models.Model):
    category = models.ForeignKey('GoodsCategory', verbose_name='對應大類', on_delete=models.CASCADE)
# SKU
class GoodsSKU(models.Model):
    category = models.ForeignKey('GoodsCategory', verbose_name='商品大類', on_delete=models.CASCADE)
    type = models.ForeignKey('GoodsType', verbose_name='商品種類', on_delete=models.CASCADE)

要在 Django 後臺管理中實現:選中水果大類後,小類下拉欄中的選項自動變成水果相關

from smart_selects.db_fields import ChainedForeignKey

# 將type屬性替換為django-smart-selects包裝後的Field型別ChainedForeignKey即可
class GoodsSKU(models.Model):
    category = models.ForeignKey('GoodsCategory', verbose_name='商品大類', on_delete=models.CASCADE)
    type = ChainedForeignKey(
        GoodsType,
        verbose_name='商品種類',
        chained_field="category",
        chained_model_field="category",
        show_all=False,
        auto_choose=True,
        sort=True)

然後 migrate

若後臺管理中次級下拉欄中的內容不能隨一級下拉欄的選擇而變化,開啟除錯工具發現錯誤,可以通過修改 site-packages\smart_selects\static\smart-selects\admin\js 中的 chainedfk.jschainedm2m.js 解決

// chainedfk.js
// 將所有程式碼替換成下面的樣子

var chainedfk = {  //第一行
    fireEvent: function (element, event) {...},
    dismissRelatedLookupPopup: function (win, chosenId) {...},
    ...
};  //最後一行
                                                         
// 同理,修改 chainedm2m.js