django-smart-selects: bindfields.js:14 Uncaught ReferenceError: chainedfk is not defined - Django Admin

Checklist

^{^{Put an x in the bracket when you have completed each task, like this: [x]}}

This issue is not about installing previous versions of django-smart-selects older than 1.2.8. I understand that previous versions are insecure and will not receive any support whatsoever.
I have verified that that issue exists against the master branch of django-smart-selects.
I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
I have debugged the issue to the smart_selects app.
I have reduced the issue to the simplest possible case.
I have included all relevant sections of models.py, forms.py, and views.py with problems.
I have used GitHub Flavored Markdown to style all of my posted code.

Error received within Google Chrome when loading Django admin page of a model with an inline model which uses smart-selects.

bindfields.js:14 Uncaught ReferenceError: chainedfk is not defined
    at initItem (bindfields.js:14)
    at HTMLSelectElement.<anonymous> (bindfields.js:35)
    at Function.each (jquery-2.2.0.js:360)
    at HTMLDocument.<anonymous> (bindfields.js:34)
    at fire (jquery-2.2.0.js:3182)
    at Object.fireWith [as resolveWith] (jquery-2.2.0.js:3312)
    at Function.ready (jquery-2.2.0.js:3531)
    at HTMLDocument.completed (jquery-2.2.0.js:3547)

Steps to reproduce

Environment:

Django 1.10.7
Latest build django-smart-selects
Jquery (2.2.0 / 2.2.3 / 2.2.4 / 3.3.1) (multiple versions tested)

Configured Django Instance as specified in the installation and configuration guides.
Smart Selects used on a Model, which is present as an InlineForm on another model Admin page
Load page

Actual behavior

Nothing. Error in Javascript prevents the code being actioned.

Expected behavior

Smart-selects should load two fields normally, and provide smart select functionality between them.

I actually removed all other Javascript references and inline javascript code from the HTML in order to check that there wasn’t a conflicting code issue, but found nothing.

The script files are loaded in the correct order, none are 404-ing:

<script type="text/javascript" src="/admin/jsi18n/"></script>
 <script type="text/javascript" src="/static/admin/js/core.js"></script>
 <script type="text/javascript" src="/static/admin/js/vendor/jquery/jquery.js"></script>
 <script type="text/javascript" src="/static/admin/js/jquery.init.js"></script>
 <script type="text/javascript" src="/static/admin/js/admin/RelatedObjectLookups.js"></script>
 <script type="text/javascript" src="/static/admin/js/actions.js"></script>
 <script type="text/javascript" src="/static/admin/js/urlify.js"></script>
 <script type="text/javascript" src="/static/admin/js/prepopulate.js"></script>
 <script type="text/javascript" src="/static/admin/js/vendor/xregexp/xregexp.js"></script>

 <script type="text/javascript" src="/static/smart-selects/admin/js/chainedfk.js"></script>
 <script type="text/javascript" src="/static/smart-selects/admin/js/bindfields.js"></script>

 <script type="text/javascript" src="/static/admin/js/calendar.js"></script>
 <script type="text/javascript" src="/static/admin/js/admin/DateTimeShortcuts.js"></script>

Can’t for the life of me see what’s wrong. I think the error being thrown-up might be misleading somehow? I even combined the smart-select Javascript together, so that there would be no scope issues.

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 3
Comments: 40 (3 by maintainers)

Commits related to this issue

create object instead function fix bug https://github.com/digi604/django-smart-selects/issues/253 — committed to IlyasValiullov/django-smart-selects by IlyasValiullov 6 years ago
[FIX] js: convert chainedfk & chainedm2m to objects Us objects instead of function and export them to global scope (window) . This is far from perfect but fix the issue #253 — committed to pparidans/django-smart-selects by pparidans 6 years ago
fix chainedfk and chainedm2m not being defined closes jazzband/django-smart-selects/issues/253 — committed to jazzband/django-smart-selects by manelclos 4 years ago

Most upvoted comments

Hi everybody, I think I fixed this in the js-unlinting-fixes branch. If you are still having the issue, can you try that and tell me if it works?

You should be able to install that branch using pip:

pip install git+https://github.com/digi604/django-smart-selects.git@js-unlinting-fixes

+24

blag on Mar 28, 2018

Solution: https://github.com/RafaDias/django-smart-selects/commit/61f182f4e56fa7f7eb1ca2fbf0fb922bb25c8a0e

christianalcantara on Mar 22, 2018

Aaaand it works now. I have no idea why chainedm2m.js and chainedfk.js are written the way they are, and I intend to continue to keep away from JavaScript for as long as possible, but for now I got it to work properly by editing chainedm2m.js this way:

var chainedm2m = {
    fireEvent: function (element, event) { ... },
    dismissRelatedLookupPopup: function(win, chosenId) { ... },
    fill_field: function (val, initial_value, elem_id, url, initial_parent, auto_choose) { ... },
    init: function (chainfield, url, id, value, auto_choose) { ... }
};

{ ... }s mean that I changed nothing within the actual methods themselves.

Same goes, again, for chainedfk.

since it works without "use strict", I guess it’s irrelevant here;
chainedfk and chainedm2m are no functions by themselves but mere containers for their methods, so may be defined as var name = { method: definition, ... };
I barely understand all that JS scope thing and don’t want to dive deeper, but written clean it works, and decorated with (function ($) { (function chainedfk(){ ... }()); } it doesn’t.

nazrow on Mar 20, 2018

Thanks worked for me too. Had to clear the cache and then it worked. But now facing the issue while edit.

Facing the issue while editing the chained m2m field. The selected options does not appear first while editing.

But if you change the main selection for the chained field then change it back to the original value the correct data loads in the corresponding multi selected field.

Any fixes for this please?

developer2806 on Jul 5, 2018

Fixed Worked Well, Make Sure You Allow Django JQuery from settings.py.

ShubhamSarda on Apr 7, 2018

Closing as it works on latest release.

manelclos on Aug 17, 2020

@blag works for me on django 2.0. Thank you

https://github.com/digi604/django-smart-selects/issues/253#issuecomment-377007803

ricardodani on Jun 4, 2018

+1, experiencing the exact same thing. Neither chainedfk nor chainedm2m work where they should (I have chained fields of both types in like a dozen different models). Respective .js files are loaded from the same /static/smart-selects/admin/js folder where bindfields.js resides, yet console shows the functions are not defined.

I’ve tried cleaning up chainedm2m.js removing all the things I don’t understand and leaving it just like this: function chainedm2m() { ... } Now the browser is able to find chainedm2m, but tells me that chainedm2m.init is not a function. Same goes for chainedfk.

nazrow on Mar 20, 2018