C
C#

Javascript not working on my MVC project

Javascript not working on my MVC project

Ddatasaur
View on Discord
11/19/2023
I'm learning front end tutorials at the moment so I'm totally new to designing websites. _Layout.cshtml: 
<!DOCTYPE html>
<html lang="en">
    stuff here to @RenderBody()
    <script src="~/js/site.js" asp-append-version="true"></script>
    @await RenderSectionAsync("Scripts", required: false)

</html>
<!DOCTYPE html>
<html lang="en">
    stuff here to @RenderBody()
    <script src="~/js/site.js" asp-append-version="true"></script>
    @await RenderSectionAsync("Scripts", required: false)

</html>
Home/Index.cshtml: 
@{
    ViewData["Title"] = "Home Page";
}

<div class="form-container sign-up">
    <form>
        <h1>Create Account</h1>
        <div class="social-icons">
            icons here
        </div>
        <span>stuff here</span>
        <input type="text" placeholder="Name">
        <input type="email" placeholder="Email">
        <input type="password" placeholder="Password">
        <button>Sign Up</button>
    </form>
</div>
<div class="form-container sign-in">
    <form>
        <h1>Sign In</h1>
        <div class="social-icons">
            icons here
        </div>
        <span>stuff here</span>
        <input type="email" placeholder="Email">
        <input type="password" placeholder="Password">
        <a href="#">stuff here</a>
        <button>Sign In</button>
    </form>
</div>
<div class="toggle-container">
    <div class="toggle">
        <div class="toggle-panel toggle-left">
            <h1>Welcome Back!</h1>
            <p>stuff here</p>
            <button class="hidden" id="login">Sign In</button>
        </div>
        <div class="toggle-panel toggle-right">
            <h1>Hello, Friend!</h1>
            <p>stuff here</p>
            <button class="hidden" id="register">Sign Up</button>
        </div>
    </div>
</div>

<script src="~/js/site.js"></script>
@{
    ViewData["Title"] = "Home Page";
}

<div class="form-container sign-up">
    <form>
        <h1>Create Account</h1>
        <div class="social-icons">
            icons here
        </div>
        <span>stuff here</span>
        <input type="text" placeholder="Name">
        <input type="email" placeholder="Email">
        <input type="password" placeholder="Password">
        <button>Sign Up</button>
    </form>
</div>
<div class="form-container sign-in">
    <form>
        <h1>Sign In</h1>
        <div class="social-icons">
            icons here
        </div>
        <span>stuff here</span>
        <input type="email" placeholder="Email">
        <input type="password" placeholder="Password">
        <a href="#">stuff here</a>
        <button>Sign In</button>
    </form>
</div>
<div class="toggle-container">
    <div class="toggle">
        <div class="toggle-panel toggle-left">
            <h1>Welcome Back!</h1>
            <p>stuff here</p>
            <button class="hidden" id="login">Sign In</button>
        </div>
        <div class="toggle-panel toggle-right">
            <h1>Hello, Friend!</h1>
            <p>stuff here</p>
            <button class="hidden" id="register">Sign Up</button>
        </div>
    </div>
</div>

<script src="~/js/site.js"></script>
The Sign Up button should display account creation fields with a little animation but it doesn't move. Added css file
Ddatasaur
View on Discord
11/19/2023
wwwroot/js/site.js: 
const container = document.getElementById('container');
const registerBtn = document.getElementById('register');
const loginBtn = document.getElementById('login');

registerBtn.addEventListener('click', () => {
    container.classList.add("active");
});

loginBtn.addEventListener('click', () => {
    container.classList.remove("active");
});
const container = document.getElementById('container');
const registerBtn = document.getElementById('register');
const loginBtn = document.getElementById('login');

registerBtn.addEventListener('click', () => {
    container.classList.add("active");
});

loginBtn.addEventListener('click', () => {
    container.classList.remove("active");
});
AAngius
View on Discord
11/19/2023
Any errors in the console? Does the file actually get loaded? Check the network panel Both in the browser devtools, F12 to open them

Looking for more? Join the community!

C
C#

Javascript not working on my MVC project

Join Server
Want results from more Discord servers?
Add your server
Recommended Posts
is there a way to get the colocation center connected to with C# ?I wanna get information about the colocation center exactly how Cloudflare warp gets it in the prefexaml and x:Class - issue (CS1061)I got a project wich some of you helped me with allready, tho there is still one issue I coudn't resCan't fire click blazor ui button```cs @page "/members" @namespace Blazor.Web @attribute [StreamRendering] <PageTitle>Members</PageTHelp Minecraft Console Client scripting(https://github.com/MCCTeam/Minecraft-Console-Client Link to MCC) is there a way to make a C# scrip✅ Bypass ASP.NET Required authenticatorIm trying to return Forbid (403) to the user if a resource already exists it all works fine but the Issues trying to create new error typesHello everyone. I'm trying to create my own extensible error type, based on the RFC 7807. ```c# puI have a Visual-Studio Proj. in .NET Framework and need help fixing the "CS0120" error it throws up.Basically I want to make an App which you just run and it will automatically, by pressing just one bplease help!!! (winforms c#)Does anyone know how can i make the user move the last drawn shape on a picturebox (the picture box WPF ScrollViewer issuesHello, I have the problem that the scrollviewer in C# (WPF) does not work properly. I haven't define✅ Quick - Unity "using" directiveReally quick question guys, when trying to use methods from other scripts in Unity, let's say the ot