Uncaught ReferenceError: Type is not defined in sp.runtime.js

javascript jquery sharepoint sharepoint-apps officedev

28,132

Solution 1

Type is defined in the MicrosoftAjax.js file. You can get access to it by using the following script tag to get it from the aspnet CDN:

<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>

You do not need the ScriptManager.

Solution 2

It's likely due to the order in which you register the scripts. Referenced libraries should be registered before the scripts that use them. It is easiest to check your page in the browser, you'll see the order in which they load.

Solution 3

You load SP.Runtime.js and SP.js twice. Once on the head and on document ready. Try to remove one of them, but the error can be another I see more error before 404.

Solution 4

you're missing the scriptmanager. Put it above <div id="divSPChrome"></div>

<asp:ScriptManager ID="ScriptManager" runat="server" EnableCdn="True" />

When your are working in html pages, just try to reference this after loading jquery.

<script src="https://ajax.aspnetcdn.com/ajax/4.0/MicrosoftAjax.js" type="text/javascript"></script>

View more solutions

28,132

Author by

Luis Valencia

Updated on October 23, 2020

Comments

Luis Valencia over 3 years

I am trying to use the taxonomy Picker example from Office PnP.

I just want to bind one field to one managed metadata term.

The errors I got are here: http://screencast.com/t/nOaTusUH4V

The code I have is:

<head>
    <meta charset="utf-8" />
    <title>Learning bootstrap</title>    
    <meta name="viewport" content="width=device-width, initial-scale=1">   

    <link href="../Content/bootstrap.min.css" rel="stylesheet" /> 
    <link href="../Content/bootstrap-theme.min.css" rel="stylesheet" />
    <link rel="Stylesheet" type="text/css" href="../Content/taxonomypickercontrol.css" />
    <script src="../Scripts/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.js"></script>

    <script src="../Scripts/app.js" type="text/javascript"></script>
    <script src="../Scripts/taxonomypickercontrol.js" type="text/javascript"></script>
</head>


body>
    <div id="divSPChrome"></div>
    <div class="container">      
        <div class="row">
            <div class="col-md-8">
                <h2>Create project site</h2>
                <form class="form-horizontal" role="form">
                    <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">Project name</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="inputEmail3" placeholder="Project name">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label">Domain</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="inputPassword3" placeholder="Domain">
                            <div class="ms-core-form-line" style="margin-bottom: 0px;">
                               <input type="hidden" id="taxPickerContinent" />

                            </div>
                        </div>
                    </div>

As you can see I have the hidden field. And my App.js file is:

// variable used for cross site CSOM calls
var context;
// variable to hold index of intialized taxPicker controls
var taxPickerIndex = {};

//Wait for the page to load
$(document).ready(function () {

    //Get the URI decoded SharePoint site url from the SPHostUrl parameter.
    var spHostUrl = decodeURIComponent(getQueryStringParameter('SPHostUrl'));
    var appWebUrl = decodeURIComponent(getQueryStringParameter('SPAppWebUrl'));
    var spLanguage = decodeURIComponent(getQueryStringParameter('SPLanguage'));

    //Build absolute path to the layouts root with the spHostUrl
    var layoutsRoot = spHostUrl + '/_layouts/15/';

    //load all appropriate scripts for the page to function
    $.getScript(layoutsRoot + 'SP.Runtime.js',
        function () {
            $.getScript(layoutsRoot + 'SP.js',
                function () {
                    //Load the SP.UI.Controls.js file to render the App Chrome
                    $.getScript(layoutsRoot + 'SP.UI.Controls.js', renderSPChrome);

                    //load scripts for cross site calls (needed to use the people picker control in an IFrame)
                    $.getScript(layoutsRoot + 'SP.RequestExecutor.js', function () {
                        context = new SP.ClientContext(appWebUrl);
                        var factory = new SP.ProxyWebRequestExecutorFactory(appWebUrl);
                        context.set_webRequestExecutorFactory(factory);
                    });

                    //load scripts for calling taxonomy APIs
                    $.getScript(layoutsRoot + 'init.js',
                        function () {
                            $.getScript(layoutsRoot + 'sp.taxonomy.js',
                                function () {
                                    //bind the taxonomy picker to the default keywords termset
                                    //$('#taxPickerKeywords').taxpicker({ isMulti: true, allowFillIn: true, useKeywords: true }, context);

                                    $('#taxPickerContinent').taxpicker({ isMulti: false, allowFillIn: false, useKeywords: false, termSetId: "51f18389-f28a-4961-a903-ee535f7c620d", levelToShowTerms: 1 }, context, initializeCountryTaxPicker);
                                    taxPickerIndex["#taxPickerContinent"] = 0;
                                });
                        });
                });
        });
});

function initializeCountryTaxPicker() {
    //if (this._selectedTerms.length > 0) {
    //    $('#taxPickerCountry').taxpicker({ isMulti: false, allowFillIn: false, useKeywords: false, termSetId: "0cc96f04-d32c-41e7-995f-0401c1f4fda8", filterTermId: this._selectedTerms[0].Id, levelToShowTerms: 2, useTermSetasRootNode: false }, context, initializeRegionTaxPicker);
    //    taxPickerIndex["#taxPickerCountry"] = 4;
    //}
}

function initializeRegionTaxPicker() {
    //if (this._selectedTerms.length > 0) {
    //    $('#taxPickerRegion').taxpicker({ isMulti: false, allowFillIn: false, useKeywords: false, termSetId: "0cc96f04-d32c-41e7-995f-0401c1f4fda8", filterTermId: this._selectedTerms[0].Id, levelToShowTerms: 3, useTermSetasRootNode: false }, context);
    //    taxPickerIndex["#taxPickerRegion"] = 5;
    //}
}

function getValue(propertyName) {
    if (taxPickerIndex != null) {
        return taxPickerIndex[propertyName];
    }
};

//function to get a parameter value by a specific key
function getQueryStringParameter(urlParameterKey) {
    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] == urlParameterKey)
            return singleParam[1];
    }
}

function chromeLoaded() {
    $('body').show();
}

//function callback to render chrome after SP.UI.Controls.js loads
function renderSPChrome() {
    var icon = decodeURIComponent(getQueryStringParameter('SPHostLogoUrl'));

    //Set the chrome options for launching Help, Account, and Contact pages
    var options = {
        'appTitle': document.title,
        'appIconUrl': icon,
        'onCssLoaded': 'chromeLoaded()'
    };

    //Load the Chrome Control in the divSPChrome element of the page
    var chromeNavigation = new SP.UI.Controls.Navigation('divSPChrome', options);
    chromeNavigation.setVisible(true);
}