How to fix Invalid field or parameter url in SP.Executor.js in people picker Sharepoint Provided-Hosted App

Question

@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <!-- IE9 or superior -->
    <meta http-equiv="X-UA-Compatible" content="IE=9">
    <title>People Picker HTML Markup</title>

    <!-- Widgets Specific CSS File -->
    <link rel="stylesheet"
          type="text/css"
          href="../Scripts/Office.Controls.css" />

    <!-- Ajax, jQuery, and utils -->
    <script src="~/Scripts/MicrosoftAjax.js"></script>
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">
        // Function to retrieve a query string value.
        // For production purposes you may want to use
        //  a library to handle the query string.
        function getQueryStringParameter(paramToRetrieve) {
            var params =
                document.URL.split("?")[1].split("&");
            var strParams = "";
            for (var i = 0; i < params.length; i = i + 1) {
                var singleParam = params[i].split("=");
                if (singleParam[0] == paramToRetrieve)
                    return singleParam[1];
            }
        }
    </script>

    <!-- Cross-Domain Library and Office controls runtime -->
    <script type="text/javascript">
        //Register namespace and variables used through the sample
        Type.registerNamespace("Office.Samples.PeoplePickerBasic");
        //Retrieve context tokens from the querystring
        Office.Samples.PeoplePickerBasic.appWebUrl =
            decodeURIComponent(getQueryStringParameter("SPAppWebUrl"));
        Office.Samples.PeoplePickerBasic.hostWebUrl =
            decodeURIComponent(getQueryStringParameter("SPHostUrl"));

        //Pattern to dynamically load JSOM and and the cross-domain library
        var scriptbase =
            Office.Samples.PeoplePickerBasic.hostWebUrl + "/_layouts/15/";

        //Get the cross-domain library
        $.getScript(scriptbase + "SP.RequestExecutor.js",
            //Get the Office controls runtime and
            //  continue to the createControl function
            function () {
                $.getScript("../Scripts/Office.Controls.js", createControl)
            }
        );
    </script>

    <!--People Picker -->
    <script src="../Scripts/Office.Controls.PeoplePicker.js"
            type="text/javascript">
    </script>
</head>
<body>
    Basic People Picker sample (HTML markup declaration):
    <div id="PeoplePickerDiv"
         data-office-control="Office.Controls.PeoplePicker">
    </div>

    <script type="text/javascript">
    function createControl() {
        //Initialize Controls Runtime
        Office.Controls.Runtime.initialize({
            sharePointHostUrl: Office.Samples.PeoplePickerBasic.hostWebUrl,
            appWebUrl: Office.Samples.PeoplePickerBasic.appWebUrl
        });

        //Render the widget, this must be executed after the
        //placeholder DOM is loaded
        Office.Controls.Runtime.renderAll();
    }
    </script>
</body>
</html>

I want to create a people picker function in SharePoint Provider-Hosted app. I tried this tutorial: https://msdn.microsoft.com/en-us/library/office/dn636915.aspx

I'm stuck on this error.

Invalid field or parameter url in SP.Executor.js

this is the code that I tried https://code.msdn.microsoft.com/SharePoint-2013-Use-the-57859f85/view/Discussions#content — Jom Orolfo, Jun 08 '16 at 04:15
Please review [How to create a Minimal, Complete, and Verifiable example](http://stackoverflow.com/help/mcve) and then include in your post an example of the code which is causing you difficulty. — Darwin von Corax, Jun 08 '16 at 04:56

score 0 · Answer 1 · answered Jun 08 '16 at 14:58

Check whether your SP.RequestExecutor.js is loaded successfully or not if not then you can give the path of the same and load it directly or you can use the below code to get the SP.RequestExecutor.js

var scriptbase = hostweburl + "/_layouts/15/";

$.getScript(scriptbase + "SP.Runtime.js",
    function () {
        $.getScript(scriptbase + "SP.js",
            function () { $.getScript(scriptbase + "SP.RequestExecutor.js", createControl); }
        );
    }
);

Hope this will resolve your issue.

I tried your code but the SPHostUrl is not found. Thanks for giving me hint to fix this error. — Jom Orolfo, Jun 09 '16 at 02:31

Jom Orolfo · Answer 2 · 2016-06-09T02:49:45.217

This solved my error. Thanks to @Rahul for the hint

var scriptbase = hostWebUrl + "/_layouts/15/";

            $.getScript(scriptbase + "SP.Runtime.js",
                function () {
                    $.getScript(scriptbase + "SP.js",
                        function () { $.getScript(scriptbase + "SP.RequestExecutor.js",
                           $.getScript("../Scripts/Office.Controls.js", createControl));
                        }
                    );
                }
            );

How to fix Invalid field or parameter url in SP.Executor.js in people picker Sharepoint Provided-Hosted App

2 Answers2