CODEWITHSUNDEEP
javascriptasp.netasp.net-mvc
Brooklyn boeykens
Brooklyn boeykens

Reputation: 45

How to reload page in MVC dynamically

Can someone help me? I want to change my page when some status change. I don't want to see that refresh sign above.

<script type="text/javascript" language="javascript">
    var idleInterval = setInterval("reloadPage()", 5000);
    function reloadPage() {
        location.reload();
    }
</script>

<h2>Verlichting</h2>

<div class="Verlichting">

    <div class="Border">
        Verlichting Garage 1
    </div>

    <div class="ButtonVerlichting">
        @if (Model.Verlichting1 == true)
        {
            <button class="On">Aan</button>
        }
        else if (Model.Verlichting1 == false)
        {
            <button class="Off">Uit</button>
        }
    </div>

    <div class="Border">
        Verlichting Garage 2
    </div>

    <div class="ButtonVerlichting">
        @if (Model.Verlichting2 == true)
        {
            <button class="On">Aan</button>
        }
        else if (Model.Verlichting2 == false)
        {
            <button class="Off">Uit</button>
        }
    </div>

    <div class="Border">
        Verlichting Garage Grind
    </div>

    <div class="ButtonVerlichting">
        @if (Model.VerlichtingGrind == true)
        {
            <button class="On">Aan</button>
        }
        else if (Model.VerlichtingGrind == false)
        {
            <button class="Off">Uit</button>
        }
    </div>

</div>

<div class="clear">

</div>

When one of the Models bool change. My page need to change when some State change. The buttons control some lights. Now I refresh te page every 5 seconds. But i want when one state change it change? I work normally with C# MVC but not with javascript of something else.

Upvotes: 1

Views: 1117

Answers (1)

Brian Ogden
Brian Ogden

Reputation: 19232

You cannot refresh the View server side or "dynamically" with your current code.

HTTP is stateless.

HTTP works like this: a client (web browser in your case, like Chrome) has requested a resource from your server (/mywebsite/myview) because you entered a web address/URL/URI into your web browser location bar. That web address is a "mapping" to your server. An HTTP GET request is sent from your browser to your server and your server is running ASP.NET, IIS processes the request and passes the request to your ASP.NET MVC app. Your controller/view route entry matches and your ASP.NET app View code is served back to the web browser in the form of an HTTP response.

Your web browser parses the Response, containing CSS/HTML and Javascript and renders the view/page.

Your browser is now disconnected from the server. Your browser is not going to talk to your server again unless you take an action like pressing a button or entering a different URL into the location bar. On the other side, your server has no current way to talk to the client browser, your server is disconnected from your client/web browser.

This is a standard HTTP request/response.

You are looking for a push notification feature in your software. Since you are using ASP.NET and are not familiar with Javascript, SignalR would be the best way to keep a connection open between the web browser and your server via Web Sockets with a long polling fallback. SignalR is very easy to use and get setup.

Long polling is what you are currently doing, you are checking every 5 seconds for a change. You can continue to this but instead of getting all the HTML/CSS and Javascript again with a reload. Simply check some other Controller/API endpoint for a state change and then reload the whole page only when that state change occurs. This is actually a reasonably scalable solution from the sounds of your current needs.

Upvotes: 1

Related Questions