I have a Main SSR Page that renders a component that has a jquery unobtrusive ajax link:
@if (rndvar != 0){<h3>Ajax Get Link</h3><a method="get" data-ajax="true" data-ajax-method="get" data-ajax-mode="replace" data-ajax-update="#ajax-update-link" data-ajax-loading="#spinner" data-ajax-success="javascript:window.pageFunctions.ajaxLinkSuccess()" data-ajax-url="/Tests/ajax-link/@rndvar" id="lnkAjax" style="text-decoration: underline; color: blue; font-weight: bold; cursor: pointer;"> Ajax Link @rndvar </a>}The component page (StaticSSRLink.razor) that this posts is:
@page "/Tests/ajax-link/{Id:int}"@layout StaticSSRComponentLayout@attribute [ExcludeFromInteractiveRouting]@if (Id != 0){<h3>Id * 2 = @result</h3>}@code { [Parameter] public int Id { get; set; } int result = 0; protected override async Task OnInitializedAsync() { await base.OnInitializedAsync(); result = Id * 2; } }the StaticSSRComponentLayout is a simple layout with only some markup.
In the Main SSR Page that has the div to replace with ajax content I have:
..<PageScript Src="./Pages/Tests/StaticSSR/StaticSSRPage.razor.js"></PageScript>..<div id="ajax-update-link"><StaticSSRLink Id="0"></StaticSSRLink></div>To be complete this is the layout that StaticSSRLink uses: (StaticSSRComponentLayout.razor):
@inherits LayoutComponentBase@attribute [ExcludeFromInteractiveRouting]<SectionContent SectionName="Ajax"><script src="lib/jquery-ajax-unobtrusive-main/jquery.unobtrusive-ajax.js"></script></SectionContent><div id="mydiv"> @{ string direction = loc["Direction"]; } @if (!string.IsNullOrWhiteSpace(direction)) {<div dir="@direction" style="text-align: start;"> @Body</div> }</div>The Problem: while this works and with any number of <a../> clicks shows a single resulting HTML page and expected HTML each time, But with every click of the <a../>, a power of 2 requests made to the server. for example, the first time: 2^1, second time: 2^2 and so on.
Is there any way to not to have these too many requests?