We are an international company and using USA date format confuses the heck out of everyone except for folks from Canada, Philippines and Belize.
Here is where we currently stand.
It was my pleasure to spent some time to solve this issue
window.fd = fd;
window.pnp = pnp;
window.$ = $;
fd.spRendered(() => {
const library = fd.control('ListOrLibrary1');
const formatDateInGrid = () => {
// Get the Kendo Grid widget from the Plumsail Forms control
const gridWidget = library.widget;
// Access the data source of the grid
const dataSource = gridWidget.dataSource;
// Iterate through each item in the data source
dataSource.data().forEach((item) => {
// Access and parse the 'Modified' date string for the current item
// I used only a column "Modified"
let modifiedDateStr = item.Modified;
// Parse the date string into a Date object
let modifiedDate = new Date(modifiedDateStr);
// Format the date to "dd-MMM-yyyy" (e.g., "18-Apr-2024")
// Select the formatting
let formattedModifiedDate = modifiedDate
.toLocaleDateString('en-GB', {
day: '2-digit',
month: 'short',
year: 'numeric',
})
.replace(/ /g, '-');
// Update the 'Modified' property in the current item with the formatted date
item.Modified = formattedModifiedDate;
});
// Refresh the Kendo Grid to reflect the updated data
gridWidget.refresh();
};
// Wait for the document to be ready before executing the script
library.ready().then(() => {
formatDateInGrid();
});
// Handle Edit event - Works gresat
library.$on('edit', () => {
formatDateInGrid();
});
// Handle Change Event
// I could not solve this issue with the executing the script too fast - it works with timeout, but it is not clear as it could be
library.$on('change', () => {
setTimeout(() => {
formatDateInGrid();
}, 200);
});
});
Please, read the comments in the code to adjust the code for your needs.
And thanks again. Just really good work getting done here. I have another installment of how we use Plumsail Forms to customize the individual user experience. Stay tuned.
There should be an event how to handle this "refresh" button, but when I inspected the control, event like "refresh" does not exist.
Right now, I am not sure how to do it. I was thinking about .binding an event "refresh" for the control before the Form is rendered, but it is quite far from my knowledge right now