I have a custom list in SharePoint 2013 with cascading drop downs for City and State fields. Due to the size of the lookup list, it takes a few seconds to fully load. During this time, it shows some of the elements that are supposed to be hidden until they are eventually hidden. Ew.
I'd like to use the SP.UI.ModalDialog while the custom list is loading to improve the overall look and user experience. It works great while loading the page to edit the CEWP. However, when actually adding/editing an item to the list, nothing is displayed and even the cascading drop downs aren't functioning.
I'm trying to get it working on a test list before implementing it on the actual list. Here is the CEWP from the test list:
<script
src="https://code.jquery.com/jquery-3.3.1.js"
type="text/javascript"
language="javascript">
</script>
<script
type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"
language="javascript">
</script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices.js"
type="text/javascript"
language="javascript">
</script>
<script type="text/javascript" language="javascript">
//Display dialogue box
oLoader = SP.UI.ModalDialog.showWaitScreenWithNoClose(SP.Res.dialogLoading15);
$(document).ready(function(){
//Cascading drop downs for State and City fields
$().SPServices.SPCascadeDropdowns(
{
relationshipList: "CitiesLookUp",
relationshipListParentColumn: "State",
relationshipListChildColumn: "Title",
parentColumn: "State",
childColumn: "City",
debug: true
});
//Close dialogue box
oLoader.close();
});
</script>
A common solution I found was specifying title and/or language attributes in the script tags - but I did this for all of them and unfortunately that hasn't worked for me.
I'm not a SP Developer and have never done web development before this request. However, I understand the basic concepts and do have programming experience. Any help is very greatly appreciated! :)