When I set on page-
@page "{categoryname}"
This causes the page to be call twice. The first time the categoryname uses an entry written on the address page. But on the second turn he calls categoryname="checkout" (I do not know if it is related to that, but on the same page there is AJAX calling the page by the above name- "checkout").
When I delete - @page "{categoryname}" it works fine and call just 1 time!
And I tried to change the name of the categoryname to another name ( i thought maybe there is another place called like that, but I saw that it also changed the name and has the same problem.)
What can I do?
Best regards
EDIT
this is the page code-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title> @ViewData["Title"] </title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/css/site.css" />
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/js/owl.carousel.min.js"></script>
<link href="~/css/owl.carousel.min.css" rel="stylesheet" />
<script src="~/js/ckeditor5-build-classic/ckeditor.js"></script>
<script src="~/js/jquery.unobtrusive-ajax.js"></script>
<script src="https://kit.fontawesome.com/5212bc06e1.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" integrity="sha384-vp86vTRFVJgpjF9jiIGPEEqYqlDwgyBgEF109VFjmqGmIY/Y4HV4d3Gp2irVfcrp" crossorigin="anonymous" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
@using OrdersCore.Interfaces
@inject Microsoft.AspNetCore.Http.IHttpContextAccessor HttpContextAccessor
@inject HomeServices Customer
@{
var currentCust = new Models.Customer();
foreach (var cookie in HttpContextAccessor.HttpContext.Request.Cookies)
{
if (cookie.Key == "OrderLoginDetails")
{
if (Customer.GetCustomer(cookie.Value) != null)
{
Customer.Cookie = cookie.Value;
}
}
}
if (Customer.Cookie == null)
{
}
}
<header style="position: -webkit-sticky; position: sticky; top: 0;z-index:99">
<div class="menuUp">
<div class="container flexMenu whiteLinks">
<div class="justMobile">
<a href="/index">
<i class="fas fa-home"></i>
</a>
</div>
<div class="justMobile">
<i class="fas fa-search"></i>
</div>
<div>
<div class="dropdown">
<i class="fas fa-shopping-cart"></i>
<div class="nonMobile">
<label class="dropbtn">
@if (@Customer.GetProductsInCart(Customer.Cookie) != null)
{
int countProd = 0;
@foreach (var item in Customer.GetProductsInCart(Customer.Cookie))
{
countProd += item.Quantity;
}
<span id="QuantityProds">
@Html.Raw(countProd)
</span>
}
else
{
<span id="QuantityProds">0</span>
}
מוצרים בסל
</label>
</div>
<div class="dropdown-content">
<span id="txtHint"></span>
<div class="btnInsertToCart" style="margin-right:auto; margin-left:0;padding:5px; width: auto;">
<a asp-page="checkout">תשלום</a>
</div>
</div>
</div>
</div>
<div>
<div class="dropdown">
<i class="fas fa-user"></i>
<div class="nonMobile">
<label class="dropbtn">
החשבון שלי
</label>
</div>
<div class="dropdown-content">
<span id="spanConnecting"></span>
</div>
</div>
</div>
<div class="justMobile">
<i class="fas fa-phone-alt"></i>
</div>
<div class="nonMobile">
ראשי | אודותינו | צרו קשר
</div>
</div>
</div>
<div class="menuMiddle">
<div class="container flexMenu">
<div>
<a asp-page="./index">
<img src="~/Images/logo.png" />
</a>
</div>
<div class="nonMobile">
<form class="search" method="get" asp-page="/search">
<button type="submit"><i class="fa fa-search"></i></button>
<input type="text" placeholder="חיפוש.." class="quantity" name="SearchString">
</form>
</div>
</div>
</div>
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-dark menuBottom border-bottom box-shadow mb-3">
<div class="container">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse d-sm-inline-flex justify-content-lg-start">
<ul class="navbar-nav">
@foreach (var item in Customer.GetNav(0))
{
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
@item.TagsName
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
@foreach (var item2 in Customer.GetNav(item.Id))
{
<a asp-page="Category" asp-route-categoryName="@item2.TagsName" class="dropdown-item">@item2.TagsName</a>
}
</div>
</li>
}
</ul>
</div>
</div>
</nav>
</header>
<div class="container">
<main role="main" class="pb-3">
@RenderBody()
</main>
</div>
<footer class="border-top footer text-muted">
<div class="container">
© 2021 - OrdersCore - <a asp-area="" asp-page="/Privacy">Privacy</a>
</div>
</footer>
<script>
$(document).ready(function () {
$('.productPrice').each(function () {
var new_text = parseFloat($(this).text()).toFixed(2);
$(this).text(new_text + " ₪");
})
$('.productDetails').each(function () {
var new_text2 = $(this).text().replace(/(<([^>]+)>)/gi, "");
new_text2 = new_text2.replace(/ /g, '');
$(this).text(new_text2);
})
});
</script>
<script>
ClassicEditor
.create(document.querySelector('#editor'))
.catch(error => {
console.error(error);
});
</script>
<script>
$(document).ready(function () {
$("#connecting").load("Connecting");
});
</script>
<script>
$(document).ready(function () {
$('.cartPrice').each(function () {
var new_text = parseFloat($(this).text()).toFixed(2);
$(this).text(new_text + " ₪");
})
});
</script>
<script>
$('#txtHint').load('Checkout #cartProducts', function (data) {
var $script = $(data).find('span[id=script]');
if ($script.length) {
$.getScript($script.html());
// remove the span tag -- no need to render it
$script.remove();
}
$('Checkout #cartProducts').html(data);
})
$('#spanConnecting').load('connecting', function (data) {
var $script = $(data).find('span[id=script]');
if ($script.length) {
$.getScript($script.html());
// remove the span tag -- no need to render it
$script.remove();
}
$('connecting').html(data);
});
function changeCart() {
$('#txtHint').load('Checkout #cartProducts', function (data) {
var $script = $(data).find('span[id=script]');
if ($script.length) {
$.getScript($script.html());
// remove the span tag -- no need to render it
$script.remove();
}
$('Checkout #cartProducts').html(data);
$('#QuantityProds').each(function () {
var new_text = parseFloat($(this).text()) + 1;
$(this).text(new_text);
})
});
};
</script>
<script>
function deleteCart(form, quant, price) {
sum = $(form).parents('tr').find('*').text();
$(form).parents('tr').remove();
$('#QuantityProds').each(function () {
var new_text = parseFloat($(this).text()) - parseFloat(quant);
$(this).text(new_text);
})
var newPrice = parseFloat($("#cartPrice").text().replace("₪", ""));
newPrice = newPrice - price;
console.log(newPrice)
$("#cartPrice").text(newPrice);
};
</script>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
@await RenderSectionAsync("Scripts", required: false)
</body>
</html>
"This causes the page to be call twice." is because you put ajax in $(document).ready(function ().
Code included inside $( document ).ready() will run once when the page Document Object Model (DOM) is ready for JavaScript code to execute.First call is your call,and the second call is by the ajax in $(document).ready().
Solution is removing the ajax from $( document ).ready().