Cannot render HillbillyCascade on SPO365 Classic

Question

I am using SPO365 in Classic Mode to render cascading dropdowns on a document library edit form. I am trying to use Hillbilly Cascade to achieve this functionality, but for some reason I keep getting an Uncaught TypeError thrown at me noting that HillbillyCascade is not a function. Has anyone else experienced this issue? Note, that I am using bootstrap in the masterpage for Classic Experience.

Has anyone known of any issues experienced with bootstrap and Hillbilly Cascade?

Code is as follows:

    <script src="//code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="../../SiteAssets/HillbillyCascade.js"></script>

<script type="text/javascript">
    $(document).ready(function() {

        var cascadeArray = new Array();

        cascadeArray.push({
            parentFormField: "POC", //Display name on form of field from parent list
            childList: "delParentTask", //List name of child list
            childLookupField: "Title", //Internal field name in Child List used in lookup
            childFormField: "Task Number", //Display name on form of the child field
            parentFieldInChildList: "delPOC", //Internal field name in Child List of the parent field
            firstOptionText: "< Select the Task Number >"
        });

        cascadeArray.push({
            parentFormField: "Task Number", //Display name on form of field from parent list
            childList: "delChildTaskName", //List name of child list
            childLookupField: "Title", //Internal field name in Child List used in lookup
            childFormField: "Task Name", //Display name on form of the child field
            parentFieldInChildList: "taskNumber", //Internal field name in Child List of the parent field
            firstOptionText: "< Select a Task Name >"
        });


        $().HillbillyCascade(cascadeArray);

    });


</script>

It's been loaded on the EditForm with a Script Editor. All url paths are correct; I can see that the Hillbilly Cascade script loads.

Error is as follows:

Uncaught TypeError: $(...).HillbillyCascade is not a function at HTMLDocument. (EditForm.aspx:696)

Answer 1

1. Try to use below code in place of document.ready():

    function runAfterEverythingElse(){
       // your code
    }
   
    _spBodyOnLoadFunctionNames.push("runAfterEverythingElse");
   

2. Also check if you are adding jQuery file multiple times in your page or not?

In that case you have to use "jQuery noConflict()".

Answer 2

Make sure you have upload the "HillbillyCascade.js" file into Site Assets library and check in.

If it still not works, try to reference the js file like this.

<script src="/sites/lz/SiteAssets/HillbillyCascade.js"></script>