I have referenced Jquery in my visualforce page and i'm getting the following error:
Here is my visualforce page:
<script src="https://code.jquery.com/jquery-1.10.1.min.js" type="text/javascript"></script>
<apex:form id="basic_form">
<apex:pageblock >
<!-- The action function which calles the Apex function 'autosave' -->
<apex:actionFunction name="autosave" action="{!autosave}" rerender="out" status="savestatus"/>
<!-- A status denotion of the update -->
<apex:actionStatus id="savestatus">
<apex:facet name="start"> Auto Saving....<img src="/img/loading.gif"/> </apex:facet>
</apex:actionStatus>
<apex:pageblocksection columns="2">
<apex:inputfield value="{!Account.Name}"/>
<apex:inputfield value="{!Account.BillingCity}"/>
<apex:inputfield value="{!Account.BillingCountry}"/>
<apex:inputfield value="{!Account.BillingState}"/>
</apex:pageblocksection>
</apex:pageblock>
<!-- A javascript recursive function which calls itself every 10 seconds, the setTimeout method calls the apex function 'autosave' defined in the <apex:actionfunction> tag above -->
<apex:includeScript value="{!URLFOR($Resource.sisyphusf, '/sisyphusf/sisyphus.min.js')}"/>
<script>
// $( function() {
// $( "#basic_form" ).sisyphus();
// alert('changed');
// // or you can persist all forms data at one command
// // $( "form" ).sisyphus();
// } );
// window.setTimeout(recursivecall,10000);
// function recursivecall()
// {
// window.setTimeout(recursivecall,10000);
// autosave();
// }
</script>
</apex:form>
</apex:page>
Best Answer
By using apex:includeScript, the sisyphusf script loading is moved to the beginning of the page:
which is before the jQuery script has been loaded.
Use the same loading mechanism for both e.g.
apex:includeScript
so they load in the correct order.