Remove JS SCRIPT from MASTER page in child pages

Question

I have a master page and 30 child pages. In my master page, I am loading prototype js which is needed on my 29 child pages.

On 30th child page, I am having pivottable.js which loads C3 and D3 charts. PivotTable.js, C3.js, D3.js are having some conflicts with prototype.js and they are not working since the master page is having prototype js reference.

If I removed prototype.js reference from master page, pivot table works as expected but other 29 other pages which require prototype js are not working. :-(

Is there any way to remove prototype reference from master page on 30th child page alone before the scripts on 30th page loads?

Hoping a reply. Thanks in advance.

Answer 1

Put your JavaScript files inside ContentPlaceHolder like below in your master page.

//SCRIPTS THAT CAN LOAD ON ALL PAGES
<script type="text/javascript" src="..."></script>

<asp:ContentPlaceHolder runat="server" ID="critical_js_files">
    //SCRIPTS THAT YOU DO NOT LOAD ON SOME CHILD PAGES
    <script type="text/javascript" src="..."></script>        
</asp:ContentPlaceHolder>

In the master page code behind, add this method:

public void DisableCriticalJavaScriptFiles()
{
    critical_js_files.Visible = false;
}

And finally, add below code in your Page_Load method in your 30th child page or any page where you do not want load those js file:

protected void Page_Load(object sender, EventArgs e)
{
    Master.DisableCriticalJavaScriptFiles();
    //REST OF THE PAGE_LOAD CODE
}

Hope this helps.