-
Search Results
-
Hello,
I am using DFFS for a SharePoint Online list. I have CustomJS that pulls data from another SharePoint List(Staff Master List). I am getting $().SPServices is not a function .I have added the JQuery Reference on Site Assets & also referenced them on the text area above the CustomJS.
Seems like JQuery is not getting loaded, but not sure how to resolve.function setDemoValues() { var PreferredName = ""; $.each(spjs.utility.getFieldValue({"fin":"Employee_x0020_Name","key":"loginName"}),function(i,login){ var userProfile = spjs.utility.userProfile(login); PreferredName = userProfile.PreferredName; setFieldValue('Title', PreferredName); }); var query = "<Query><Where><Eq><FieldRef Name='Name' /><Value Type='User'>" +PreferredName + "</Value></Eq></Where></Query>"; var camlViewFields = "<ViewFields><FieldRef Name='Reports_x0020_To'/><FieldRef Name='Department'/><FieldRef Name='Position'/><FieldRef Name='Job_x0020_Title'/></ViewFields>"; $().SPServices({ operation: "GetListItems", async: false, webURL: "http://xxxx/yyyyyyyy", listName: "Staff Master List", CAMLViewFields: camlViewFields, CAMLQuery:query, completefunc: function(xData, Status) { $(xData.responseXML).SPFilterNode("z:row").each(function() { if ($(this).attr("ows_Reports_x0020_To")) { TeamLeadr_str = $(this).attr("ows_Reports_x0020_To").split(';#')[1]; setFieldValue('Reports_x0020_To',TeamLeadr_str); } if ($(this).attr("ows_Department")) { setFieldValue('Department', $(this).attr("ows_Department")); } if ($(this).attr("ows_Position")) { setFieldValue('Position', $(this).attr("ows_Position")); } if ($(this).attr("ows_Job_x0020_Title")) { setFieldValue('Position_x0020_Level', $(this).attr("ows_Job_x0020_Title")); } }); } }); }
Alex,
I’m unsure what is happening, but my autocomplete field no longer retains its values.I’m running in a newer version of Chrome. I’m using the subsite with the troublesome “&” in its name that doesn’t encode to a %26. The field is a standard text field that brings report IDs (numeric) from the lookup list. It’s multi-select with a separator of “; “ It’s the same configuration as another working site.
When I select an item in the AC, the number(s) show up under the field as I would expect. When I do a getFieldValue on it I get ‘’. If I save, they don’t save with it. I commented out the AC code, did a plain type of the report ID, and ran the same getFieldValue and the ID returned.
I’ve made no changes to it and just noticed ut today after it had been working fine prior.
I have a lookup column that shows choices from another list.
For example
My first list contains a column for “office” and a column for “postcode”
In my second list I have a lookup to the first list and show the “office” value but I also want the postcode to be placed into another text column in the second list.Is there an easy way to retrieve “other” columns from the first into the scond list?
(I’m sure there is!)
Topic: Custom JS examples
To use all these examples you must have v1.0.12.0 or later
Updated April 29, 2025: Added required vLookup example and added the goToEditForm parameter in the dffs_PreSaveAction example.
Updated February 04, 2024: Added dffs_vLookup_callback example
Updated September 07, 2023: Updated dffs_showModal code example and added dffs_hideModal
Please note that you can do most of this with rules. Using Custom JS is an option for advanced users.
Do something before the item is saved
You can use a function like this to run your own custom code before save. The function must return true to allow save, or false to stop the save. If you use this function it will run before the rules triggering on “Before save of the form” and “After save of the form”. If your function returns false the rules described will not run.
function dffs_PreSaveAction(exit, autosave, goToEditForm) { if (exit) { // Code only runs when you use SaveAndExit (new in v1.0.46.0) // This example will prevent save if the title field value is not "test" if (getFieldValue("Title") !== "test") { alert("Nope, you cannot save!"); return false; } // Allow save return true; } else { if (autosave) { console.log("AutSaving"); } else { console.log("QuickSaving"); } } }
Save the item from Custom JS
Call this function from Custom JS to save the form:
dffs_triggerSave(true); // Save and exit dffs_triggerSave(false); // Quick save
Do something after the item is saved
You can use a function like this to run your own custom code after the item is saved
function dffs_PostSaveAction() { // Do something after the item is saved - for example redirect to another page // You can read values from the current item using getFieldValue("Name_of_field") location.href = "https://contoso.com/SavedMsg"; }
Do something if the item is cancelled / closed
You can use a function like this to run your own custom code if a form is opened and then cancelled out of without saving.
function dffs_PostCancelAction() { // Do something if the item is cancelled - for example redirect to another page location.href = "https://contoso.com/CancelMsg"; }
Do something if the item is deleted
You can use a function like this to run your own custom code after an item is deleted (from within a form, not from the list view menu).
function dffs_PostDeleteAction() { // Do something if the item is deleted - for example redirect to another page location.href = "https://contoso.com/DeletedMsg"; }
Show a modal dialog
To show a modal dialog with a custom message you can use this code. Please note that this will be a non-blocking dialog so it will not prevent other code from running when the dialog is shown (like the default browser “alert” function does).
var modalId = dffs_showModal({ "title": "A message to you", "body": "Add your message body here. You can use plain text or HTML", "isBlocking": true, "showClose": true, "showFooter": true, "closeCallbackFn": () => { // Add your custom code that runs when the dialog has been dismissed alert("Closed"); }, "cancelBtnLabel": "Cancel button", "cancelBtnFn": () => { // Add your custom code to run when clicking the cancel button }, "okBtnLabel": "OK Button", "okBtnFn": () => { // Add your custom code to run when clicking the OK button } });
If you don’t include the “cancelBtnFn”, the Cancel button is not shown. The OK button will always show (unless you set “showFooter”: false) and will by default close the dialog.
New in v1.0.32.0 is that the dffs_showModal returns the ID of the modal – which can be used to programatically close the modal like this:
dffs_hideModal(modalId);
Trigger custom code when a field is changed
Use a function like this to run custom code when a field is changed.
function dffs_fieldChanged(fin, new_value, previous_value) { console.log("The field " + fin + " was changed from"); console.log(previous_value); console.log("to"); console.log(new_value); }
Toggle readonly on a field
Toggling readonly can be easily done in rules, but if you want to do it using custom js you can do it like this:
// Set as readonly dffs_doReadonly(["Status", "Title", "AssignedTo"]); // Undo readonly dffs_undoReadonly(["Status", "Title", "AssignedTo"]);
Toggle the visiblity on individual options in a choice field
The code example was changed because of a change in v1.0.46.0
dffs_choice_option_hidden = {"DropdownChoice_31838417512562245": { "Enter Choice #1": true, "Enter Choice #3": true }};
The id (DropdownChoice_31838417512562245) for your field can be found in the field property panel. Add the label of the options you want to hide and set the value to true. Reversing the action and make them visible again by setting the value as false. You only have to address the options you want to hide or show.
Detect change in a field
Use this in for example dffs_PreSaveAction to detect change in the title field:
if(dffs_beforeProperties["Title"] !== getFieldValue("Title")){ alert("Title has changed!"); }
Add a callback when a vLookup has loaded
You can use this method to run your own custom code when a vLookup has loaded. You can find the id of the vLooup in the vLookup configurator.
function dffs_vLookup_callback(id, items){ if(id === "vLookup_7943515991751215"){ console.log(id, items); } }
Set a vLookup as required using Custom JS
This example adds a red border around the vLookup table and stops the save if the vLookup doesn’t have any items. You must edit the vlookup config and find the id of your instance and replace vLookup_19846478236782328 in the code snippet below.
// This variable is set to true if the vLookup has any items and is used in the dffs_PreSaveAction function. let has_vLookup_items = false; function dffs_vLookup_callback(id, items) { if (id === "vLookup_19846478236782328") { if (items.length > 0) { has_vLookup_items = true; } } } function dffs_PreSaveAction(exit, autoasave, goToEditForm) { if (exit) { // Only run when save and exit if (!has_vLookup_items) { document.querySelector("#vLookup_19846478236782328").style.border = "3px red solid"; return false; } } }
Flag, clear or check mandatory fields from Custom JS
These functions requires v1.0.65.0 or above.
// Flag fields as required dffs_flagMandatory(["Field_1", "Field_2"]); // Clear the required flag from fields dffs_clearMandatory(["Field_1", "Field_2"]); // Check if all mandatory fields have been filled in. let allFieldsFilledIn = dffs_checkMandatory(false); // Shows required fields banner to alert the user of any enpty required fields let allFieldsFilledIn = dffs_checkMandatory(true); // Do not show any message to the user
Please note that flagging a field that is not in the form has no effect.
Set date field when adding new item from a calendar view
To automatically set the start date on the list item when clicking in the calendar to create a new item, you must use this snippet of Custom JS in your NewForm (replace DueDate with your actual date field internal name):
if(sessionStorage.getItem("__dffs_NewCalendarItemDate") !== null){ setFieldValue("DueDate", new Date(sessionStorage.getItem("__dffs_NewCalendarItemDate"))); }
Set bucket-identifier when adding new items in a board-style list view
To automatically set the bucket id (choice field) on the list item when clicking the add new button at the top of a bucket, you must use this snippet of Custom JS in your NewForm (replace Category with your actual choice field internal name):
if(sessionStorage.getItem("__dffs_BoardViewBucketId") !== null){ setFieldValue("Category", sessionStorage.getItem("__dffs_BoardViewBucketId")); }
Post any question below.
Best regards,
Alexander- This topic was modified 2 years, 9 months ago by .
- This topic was modified 2 years, 4 months ago by . Reason: Added more examples
- This topic was modified 1 year, 10 months ago by .
- This topic was modified 1 year, 10 months ago by .
- This topic was modified 1 year, 8 months ago by . Reason: Added more examples
- This topic was modified 1 year, 5 months ago by .
- This topic was modified 1 year, 5 months ago by .
- This topic was modified 1 year, 5 months ago by .
- This topic was modified 1 year, 5 months ago by .
- This topic was modified 1 year, 5 months ago by . Reason: Added dffs_vLookup_callback example
- This topic was modified 11 months, 1 week ago by .
- This topic was modified 5 months, 3 weeks ago by . Reason: Added information about setting startdate from calendar
- This topic was modified 5 months, 3 weeks ago by . Reason: Added information about setting bucket-identifier
- This topic was modified 2 months, 1 week ago by .
Topic: VLOOKUP
Hi Alex,
Background
We have two lists connected through Vlookup , List A and List B. Basically List A is a leave request form and List B keeps records leave days taken and remainder etc.(print screens annexed).Objective
a)To display 2 columns on New Form from List B which are connected to list A through
Vlookup. Remainder & Leave days to be takenb) To prevent user from saving the forms if the remainder of leave days is not enough. I tried to create a Javascript code that will basically make calculations based on two columns from list B (leave taken & remainder) and one column from List A (days taken). Basically to say if (leave taken + days taken > remainder ) then an alert is made “no enough leave days etc and the form is not saved (submitted. However this giving an error, that bring me to another question.
It is possible to get Field Values from columns of another list connected through Vlookup.? through getFieldValue?I hope i was clear.
I cannot get the below custom-js to save to my lookup list. I have tried a few things to trouble-shoot. 1) Permissions are good 2) Thought perhaps when the Display Name is different from FIN it would make a difference so tested with another field with both the same – didn’t make any difference 3) Tried turning isLookupInSelf = false, and 4) tried adding to the lookup list with spjs-lookup which worked just fine. I recently installed v4.4.3.45 but had not put this code into any previous version so I don’t know if it worked before I upgraded. We have SP2013 back end (server) but still SP2010 front end. I tried in a SP2013 evaluation site but kept getting SOAP errors. My code is below and I have attached a screenshot of field and the console error message I received, however I received this error message in Google Chrome but not IE11; new item was not saved in either browser. Any thoughts? Thank you, as always.
spjs.ac.textField({
“applyTo”: “Company”,
“helpText”: “Start typing to search for Company”,
“loadText”: “”,
“listGuid”: “69B37C20-7963-420C-94A1-97F8E9C5DEF9”,
“listBaseUrl”: “/sites/DCO/ACDC/ACDCDev”,
“showField”: “Title”,
“searchFields”: [],
“filterCAML”: “”,
“useREST”: false,
“preloadData”:false,
“filterREST”: “”,
“optionDetailFields”: [],
“optionDetailPrefix”: [],
“enforceUniqueValues”: true,
“rowLimit”: 15,
“listOptionsOnFocus”: false,
“minLengthBeforeSearch”: 3,
“reValidateOnLoad”: false,
“allowAddNew”: true,
“isLookupInSelf”: true,
“addNewAdditionalFields”: [],
“multiselect”: false,
“multiselectSeparator”: “; “,
“orderBy”: {
“fin”: “Title”,
“ascending”: true
},
“setFields”: [],
“debug”: true
});