These are my files and I tried to import my files by using OnAfterRenderAsync(bool firstRender) , but after I've executed my application,I didn't see my files in the "view page source" in the browser.
This is my code please :-
_Host.chtml (Head Section)
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Test</title>
<base href="~/" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui-1.8.16.custom.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.ui.touch-punch.min.js" type="text/javascript"></script>
<script src="/Scripts/allinone_bannerRotator.js" type="text/javascript"></script>
<script>
jQuery(function () {
jQuery('#allinone_bannerRotator_universal').allinone_bannerRotator({
skin: 'universal',
width: 893,
height: 496,
responsive: true,
thumbsWrapperMarginBottom: -35,
showNavArrows: false,
showCircleTimer: false,
showCircleTimerIE8IE7: false,
autoHideBottomNav: false,
showPreviewThumbs: false
});
});
</script>
</head>
_Host.chtml (BodySection)
<body>
<script src="_framework/blazor.server.js"></script>
</body>
**MainLayout.razor **
@code {
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
await JSRuntime.InvokeAsync<IJSObjectReference>("import", "https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js");
await JSRuntime.InvokeAsync<IJSObjectReference>("import", "./Scripts/jquery-ui-1.8.16.custom.min.js");
await JSRuntime.InvokeAsync<IJSObjectReference>("import", "./Scripts/jquery.ui.touch-punch.min.js");
await JSRuntime.InvokeAsync<IJSObjectReference>("import", "./Scripts/allinone_bannerRotator.js");
}
}
}
Note :- When I move blazor.server.js from body to head , everything working fine. Could anyone helps me please ?