Refreshing a List or Library control

Hi, I have a Library control on my form that is filtered to show only certain items (using CAML filtering on the Title column) - after an item has been uploaded I use some code to update metadata on the uploaded item (I’m updating the Title field, and also filtering by this value in CAML).

The filtering and updating works perfectly, however following upload the Title field is blank, so it initially appears that there is nothing in the Library until an F5 refresh, at which point the uploaded document appears.

Is it possible to force a refresh on the List or Library control so that my form updates in real time - I don’t want to force the whole form to reload so is it possible just to refresh the component?

Dear Abolam,
Please, try using the following code to refresh List or Library control:

fd.control('SPDataTable0')._dataProvider.refresh();

Hope this helps, let me know the result!

Hi Nikita, spot on thanks, works well. Is there a reference for all of these functions (such as _dataProvider) in Vue or are these native Forms functions?

Dear Abolam,
Functions and properties that start with underscore, like _dataProvider are usually meant for internal use only, but in case the situation requires they can be utilized just as well, even though they are undocumented. It’s possible that in the future there will be a public version as well, then it will be added to documentation.

will this work with SP Forms? If so, how do I use it?

Dear @Jamail_Serio,
Not sure what you mean - what's the exact scenario when you want to refresh a List or Library? Now you can just use this to refresh List or Library control:

fd.control('SPDataTable1').refresh();

I have a SP List. It is quite long, so my idea is to split into two separate list.

Both are still coming from one SP list, I just created two views then created 2 data tables. My concern is that when a new location is added on the Staff Demographic, I also need that to be added on the Senior Leadership Demographic. Hence, I thought of doing a refresh button. However, I'm not able to make it work. I tried several permutations of this code but can't seem to make it work.

fd.spRendered(function() {
    //new button
    var button = {
        text: 'Refresh',
        class: 'btn-secondary',
        visible: true,
        icon: 'Refresh',
        iconType: 0,
        click: function() {
            alert('Button clicked!');
        }
    }

    fd.control('SPDataTable12').ready().then(function(dt) {
        //dt parameter is the same as fd.control('SPDataTable1')
        dt.buttons.push(button);
    });

});

I hope I was able to explain, please help.

Dear @Jamail_Serio,
When exactly do you want to refresh it? Do you want an auto-refresh? I can see in your code that you're adding a button, but there already should be a button to refresh List or Library control in the upper right corner of the control:
image

If you don't have this button - let me know what version of SharePoint you are using, and what version of the app package you currently have in the App Catalog:

Sorry for replying late. I made it work somehow and got it working. thank you so much for always helping.

1 Like