Saturday 15 June 2013

SP2013: Calling SP.ClientContext for an anonymous user causes "object doesnt support this method"

Good Morning!, and what a wonderful Saturday morning it is, the scent of strawberries are in the air!

So I've been working on a public facing 365 website lately and making a few customisations, one request I received was to have the ability for users to add an item to a "mailing list" list, and they wanted maximum portability, so I thought, perfect for the JS-CSOM!

Such a simple idea, add an item to a list, just needs one field adding in very straight forward, or so I thought, so I created the js function and hooked it up, for auth users it worked like a charm but I ran into a problem when accessing it anonymously, I got the error "object doesn't support this method" when calling a new "SP.ClientContext", its a straight forward error meaning it cant find the function in any loaded libraries, so I thought right, gotta be SP not loading sp.js, simple, add a script link in there... no luck the same error came up, then I thought right, gotta be that the method is running before SP.js is properly loaded so I used "ExecuteOrDelayUntilScriptLoaded()" to encapsulate my code and make sure it runs after the code is loaded, published the js and checked it again... no luck!

So it has to be sp.js not loading correctly, remembering the SoD SharePoint is so fond of I then tried the trusty "SP.SOD.executeFunc('sp.js', 'SP.ClientContext', addToMailingList)", and it worked perfectly!

Code:

$("#ben-mailinglist-confirm").click(function () {
    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', addToMailingList)
});

function addToMailingList(metadata) {
    var metadata = $("#ben-mailinglist-email").val();
    if (metadata != "") {
        var clientContext = new SP.ClientContext("/");
        var list = clientContext.get_web().get_lists().getByTitle('MailingList');

        var itemCreateInfo = new SP.ListItemCreationInformation();
        var listItem = list.addItem(itemCreateInfo);
        listItem.set_item('Title', metadata);
        listItem.update();

        clientContext.load(listItem);
        clientContext.executeQueryAsync(
       Function.createDelegate(this, function () { $(".ben-mailinglist-success").show(); $(".ben-mailinglist-form").hide(); }),
       Function.createDelegate(this, function () { $(".ben-mailinglist-failure").show(); })
   );
    }
    else {
        // validation
    }
}

4 comments:

  1. Thanks for this!

    Is this a sharepoint hosted app and do you create a new client web part and put the javascript above into app.js?

    If I create a sharepoint hosted app, deploy it, trust it and I'm taken to the default.aspx page where it works fine. If I create a new client web part and reference app.js I get "TypeError: SP.SOD is undefined" when loading it. Would you mind explaining a bit more detailed what hosting mode you chose and how you deployed it?

    Many Thanks

    ReplyDelete
  2. Zuhal Kılıçaslan29 August 2013 at 12:31

    Thank you for this post:) It's really helped me.

    ReplyDelete
  3. This comment has been removed by a blog administrator.

    ReplyDelete
  4. This comment has been removed by a blog administrator.

    ReplyDelete