I Want To Make A Display Form That Can Be Updated

Forms SharePoint Online
1

I want to make a display form that will have a toggle that will used PNPJS to update the corresponding field in the SharePoint list. I want the user to be able to toggle the Read field and use PNPJS to update the list. I can't find any documentation on how to used the click/change event. Or how to set the toggle value based on value of the SharePoint control.

Annotation%202020-05-05%20151754

2

So far, this is what I have figured out:

fd.spRendered(function(vue) {
    fd.field('Toggle1').$on('change', function(value) {
        sp.web.lists.getByTitle('Reading Assignments').items.getById(fd.itemId).update({
            Read: -1
        });    
    });
});

I get the change event just fine. I get the value. I don't seem to have the PNP update correct. I get the following error.

spform.js:26 Uncaught (in promise) Error: Error making HttpClient request in queryable: [400] Bad Request
at new t (spform.js:26)
at t.e.handleError (spform.js:26)
at spform.js:36
at new Promise ()
at t.parse (spform.js:36)
at spform.js:26

3

This much works so far:

fd.spRendered(function(vue) {
    fd.field('Toggle1').$on('change', function(value) {
        sp.web.lists.getByTitle('Reading%20Assignments').items.getById(fd.itemId);
    });
});

So, what I must be doing wrong is the update.

5

Hello @smithme,

You need to place the value in commas, like this:

        sp.web.lists.getByTitle('Reading Assignments').items.getById(fd.itemId).update({
            Read: '-1'
        });

Also, please make sure that you are using the internal name of the field.

Please see the PnPjs documentation here to know more about the update method.

1 Like