Razor pages <ul> links dont seem to work when changed

Question

User-973886032 posted

hi guys

I am a bit confused but whenever I change my <ul> links in my razor pages project, it does not work, as it points to the root folder.

I cant seem to find anyone with similar problems online

////I changed this


 <ul class="navbar-nav flex-grow-1">
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
                        </li>
                    </ul>



////    To this

  <ul class="navbar-nav flex-grow-1">
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-page="/Departments">Departments</a>
                        </li>
                    </ul>

Answer 1

User475983607 posted

afrika

I am a bit confused but whenever I change my <ul> links in my razor pages project, it does not work, as it points to the root folder.

I cant seem to find anyone with similar problems online

The forward slash is relative to the root.  So slash Privacy (/Privacy) means go to the root then find Privacy under the root.  Relative path have been around a long time and are used heavily in web apps.

https://www.w3schools.com/html/html_filepaths.asp

Answer 2

User-821857111 posted

There are a few of reasons why tag helper links point to the home page rather than the intended target page:

1. There is no matching file at the expected location. e.g. there should be a file named Privacy.cshtml in the Pages folder.
2. The file exists, but it doesn't have an @page attribute.
3. There is an @page attribute, but it specifies an override route instead

https://www.learnrazorpages.com/razor-pages/routing

Answer 3

User-973886032 posted

the page does exist, see this

https://www.youtube.com/watch?v=8mIzWd6zemc&feature=youtu.be

Answer 4

User711641945 posted

Hi afrika,

It should be:

<a class="nav-link text-dark" asp-area="" asp-page="/Departments/Index">Departments</a>

Best Regards,

Rena

Answer 5

User-821857111 posted

Like Rena Ni says, you have to include the page's file name in an asp-page attribute, even if it is the default page (i.e. index). It's not the same as an href attribute on a anchor element.

See Note 3 here: https://www.learnrazorpages.com/razor-pages/tag-helpers/anchor-tag-helper#notes

Answer 6

User-973886032 posted

thanks guys