You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Aug 08 2021 03:36 AM
Hi Team,
After dropdown changevent completion page gets reloaded everytime. I want to stop after function execution. Kindly help.
<script type="text/javascript">
$( document ).ready(function(){alert('page load...');$('select[id^="ctl00_ctl04_ctl00_ddlCrossWebLookupColumn"]').change(function(){alert('dropdown change event called');functionTest();
});
I have a dilemma - my javascript code needs to be executed when the DOM is ready. However, at the same time I need to be able to hook up to the load event of another script. So hypothetically speaking I need something like this:
ExecuteOrDelayUntilScriptLoaded(getData, "sp.js"); function getData() { (document.ready(function() { //my code to get data from sharepoint list. })); }Only the latter does not seem to work.
Please suggest!
Document ready in SharePoint
Last time, my team has worked with javascript on SharePoint page
There are a inject javascript on the page with a Script editor webpart. We did a try to run a function after page load with a common jquery fuction
$(document).ready()
As our expect, code included inside $( document ).ready() will run once the page Document Object Model (DOM) is ready for JavaScript code to execute. More detail about this function you can find more at //learn.jquery.com/using-jquery-core/document-ready/
But our problem is the code was not execute as normal. So we work around on this
$(document).ready(function() {
setTimeout(function(){ execute code here},3000);
});
It works but it was not a good solution.
After research, I cannot remember exactly where, but finally I belive below code is the best solution for this issue.
SP.SOD.executeFunc(‘sp.js’, null, function(){ // Execute code here
})
Cheers
Hoang Nhut NGUYEN
If I understand your question correctly, you are asking how to stack asynchronous calls so that the second function only executes when the first is complete.
Look into jQuery deferreds, they allow you to do exactly this: api jquery com
Take this as an example:
_spBodyOnLoadFunctionNames.push("Init"); function Init() { Func1().done(function() { Func2().done(function() { Func3().done(function() { // All three functions with asynchronous calls now completed in order successfully }); }); }); } function Func1() { var dfd = $.Deferred(); $.ajax({ url: //url, type: "GET", headers: { "accept": "application/json;odata=verbose", }, success: function (data) { // Do something with data if you want to dfd.resolve(); }, error: function (data) { // Do something with data if you want to dfd.reject(); } }); return dfd; } function Func2() { // Exactly as Func 1 } function Func3() { // Exactly as Func1 }First Func1 will execute. Only when the ajax call has returned successfully will Func2 then execute. If Func1's ajax call failed Func2 will not be executed. This is what the deferred object's resolve and reject functions ensure.
As you'll see in the link above, if you want Func2 to execute regardless of the result of Func1's ajax call then use the always method in place of done.
So the effect of the above code will be first Func1 begins and completes, then Func2 begins and completes, then Func3 begins and completes.
If you have a requirement to wait for the ajax calls from Func1 and Func2 to return successfully (in any order) before making the ajax call in Func3, you can do this:
function Init() { $.when(Func1(), Func2()).done(function() { Func3(); }); }If there is no dependency on one function running before another then your Init function just needs to look like this:
function Init() { Func1(); Func2(); Func3(); }With this, although each function will be executed in order, the result of each one's asynchronous ajax calls could return in any order.
A note about _spBodyOnLoadFunctionNames. This is SharePoint's version of jQuery's $(document).ready. It ensures all SharePoint related elements are loaded.