3 tier SP Services Cascading Dropdown

Question

I have 4 lists:

1. Category
2. Subcategory
3. Detail
4. IT Service Request

Column Details:

1. Category list has one column: "Title"
2. Subcategory list has two columns: "Title" and a lookup column named "Category"
3. Detail list has two columns: "Title" and a lookup column named "Subcategory".
4. IT Service Request list has multiple columns: Assigned On/Assigned To/Requester name, etc.

Here is my script:

<script src="//code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="https://cdnjs.cloudfare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$().SPServices.SPCascadeDropdowns({
relationshipList: "Subcategory",
    relationshipListParentColumn: "Category",
    relationshipListChildColumn: "Title",
    parentColumn: "Category",
    childColumn: "Subcategory",
    debug: true
})
$().SPServices.SPCascadeDropdowns({
    relationshipList: "Detail", 
    relationshipListParentColumn: "Subcategory", 
    relationshipListChildColumn: "Title",
    parentColumn: "Subcategory",
    childColumn: "Detail",
    debug: true
})

In my "IT Service Request" list, I added it into the source in a content editor in Newform.aspx. At first, this worked just fine. But something happened and all of a sudden it's not working at all. I tested JQuery and it is loading. But my cascading dropdown isn't working whatsoever.

I'm pulling my hair out trying to figure out what's wrong. Help!

I'm using SharePoint Enterprise 2016. Thank you!

Answer 1

The "https://cdnjs.cloudfare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices.min.js" is not exists.

Modify the code as below to make it works.

<script src="//code.jquery.com/jquery-1.10.1.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices-2014.02.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
    $().SPServices.SPCascadeDropdowns({
        relationshipList: "Subcategory",
        relationshipListParentColumn: "Category",
        relationshipListChildColumn: "Title",
        parentColumn: "Category",
        childColumn: "Subcategory",
        debug: true
    });
    $().SPServices.SPCascadeDropdowns({
        relationshipList: "Detail", 
        relationshipListParentColumn: "Subcategory", 
        relationshipListChildColumn: "Title",
        parentColumn: "Subcategory",
        childColumn: "Detail",
        debug: true
    });
})
</script>

I suggest you download the jquery-1.10.1.min.js and jquery.SPServices-2014.02.min.js files and upload it to Site Assets library, then reference the files from the library.