logo

ASP.NET : How include the jquery and bootstrap javascript into a master page

Overview: Install the jQuery and Bootstrap CSS using the Manage NuGet Packages. In your masterpage include the bootstrap.css as a linked file. Create an global.asxa using a text editor. Set the path for the jquery and bootstrap scriptreference in the Scriptmanager component. The scriptmanager must be encapsulated by a form tag.

Master Page


<head>
    <link href="/Content/bootstrap.css" 

rel="stylesheet" />
    <link href="/Content/overrides.css" 

rel="stylesheet" />
</head>

form
 <asp:ScriptManager ID="scriptManager1" 

runat="server" OnLoad="ScriptManager_Onload" 

ScriptMode="Release" EnableCdn="true" >
            
        <Scripts>
        <asp:ScriptReference name="jquery" />
        <asp:ScriptReference name="bootstrap" />
        </Scripts>
        </asp:ScriptManager>

Global.asax


<script Language="vbscript" RunAt="server">
    Sub application_OnStart()
        Dim myScriptResDef As ScriptResourceDefinition
        myScriptResDef = New ScriptResourceDefinition
        myScriptResDef.Path = "/Scripts/jquery-

2.2.3.js"
        myScriptResDef.DebugPath = "/Scripts/jquery-

2.2.3.js"
        myScriptResDef.CdnPath = 

"http://ajax.microsoft.com/ajax/jQuery/jquery-

2.2.3.min.js"
        myScriptResDef.CdnDebugPath = 

"http://ajax.microsoft.com/ajax/jQuery/jquery-

2.2.3.js"
        

ScriptManager.ScriptResourceMapping.AddDefinition

("jquery", Nothing, myScriptResDef)

        myScriptResDef = New ScriptResourceDefinition
        myScriptResDef.Path = "/Scripts/bootstrap.js"
        myScriptResDef.DebugPath = 

"/Scripts/bootstrap.js"

        

ScriptManager.ScriptResourceMapping.AddDefinition

("bootstrap", Nothing, myScriptResDef)

    End Sub
</script>
s