Blazor Tutorial : JavaScript Interop | Calling JavaScript from C# - EP06



Hey Coders,
Subscribe here – https://www.youtube.com/channel/UCetyodKOWGk5H6FoKoFnkZw
Talk to us on – https://www.twitch.tv/curiousdrive

Like our page – https://www.facebook.com/curiousdrive/
Follow us on – https://twitter.com/curious_drive
Follow us on – https://www.instagram.com/curiousdrive/

Make a donation – https://www.paypal.me/curiousdrive
Be a member – https://www.patreon.com/curiousdrive

Find Code here – https://github.com/CuriousDrive/BookStores

In this #Blazor video, I am exploring how you can call #JavaScript functions from #C# in our blazor apps.

Content –
1. How to inject IJSRuntime in blazor component
2. Call JS alert() function
3. Pass parameter to your JavaScript function
4. document.getElementById
5. ElementReference
6. Call API from JS example

#CuriousDrive #WeLoveCoding

15 thoughts on “Blazor Tutorial : JavaScript Interop | Calling JavaScript from C# – EP06”
  1. Hi, Thank you for your great videos. I have a question. Im trying to do stepper in javascript and calling it in c# and using async method like you do, but I want it each time I click on "next button" page redirect to the next and at the same time shows that its going to the next label/input. tried using @ref but I wonder if I need different reference name for each click going to different page or do I need a loop in c#?
    Thanks in advance,
    Parisa

  2. I am part of a parent group preparing coding tutorials for high school students. It would be of great benefit to demonstrate some debugging techniques. For example at time <9:00> in your video, I have accidentally typed the .focus(); command with an uppercase .Focus();. This has caused an exception but the only message available was a vague one at the bottom of the page. It's useful to show debugging techniques such as Ctrl + Shift + J for this kind of error which is not discovered during the compilation time, these are difficult to find by newbies to web development.
    Otherwise, the tutorial is fairly good.

  3. Great video! One question though, you had to switch from the Blazor InputText component to the classic html one so that you can get a reference but that way you lost the option to show that "First name is required" and the color overlining when it has invalid input. Is there really not a way to bring into focus the InputText from Blazor component? I feel like it's kind of whacky solution.

  4. For whatever reason, the first city in the dropdown (NY in this case) value is not being retained on save. If I put " <option value="">select city..</option>" ontop of the foreach loop, it'll work but I'm curious how to solve it for pre-selected values.

  5. Great Videos! They are really easy to follow along, they have a great pace, and are the perfect length. I have already learned a lot, and this one really helped me understand the JavaScript Interop, which I was struggling with when reading about it in other tutorials. The hands-on and seeing it in action and coding along really helps to understand what is going on.

    The one downside I noticed with Blazor is it doesn't play well with third party JS and JQuery code. I would love to see a video on how to connect up third-party JavaScrip libraries to Blazor if there is an easy way to do that, or even if there is a way to do that at all.

    Please keep up the great videos!

Leave a Reply

Your email address will not be published.