Call to a simple jQuery click() function on Blazor not working

Question

I am starting with Blazor and just saw how to add jquery (in the index.html file as I regularly would) then, I want to add this code:

<script>
        $("#menu-toggle").click(function (e) {
             e.preventDefault();
            $("#wrapper").toggleClass("toggled");
        });
    </script>

This is under a jquery then bootstrap js as such:

    <script src="_framework/blazor.webassembly.js"></script>
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.bundle.js"></script>

The bootstrap aspect of it works fine (I can use the default collapse of a menu button, but I can't get the other jquery code to work. There's no error being thrown so I'm not sure what I might be missing.

I was looking at: How to do client-side UI events in Blazor but either that isn't working or I'm not adding it to the right place.

Answer 1

Try to put this code:

$("#menu-toggle").click(function (e) {
         e.preventDefault();
        $("#wrapper").toggleClass("toggled");
 });

in a JavaScript method you should call using JSInterop from with the OnAfterRender(Async) pairs.

hope this helps...

Answer 2

you can not add Javascript to Razo page. Only place is the host cshmtl, where Blazor is initated.