CODEWITHSUNDEEP
c#javascriptjqueryajaxasp.net-mvc
Qba
Qba

Reputation: 128

Separately refresh each row in table in ASP.NET MVC

Iam struggling with a problem of refreshing each row in table in ASP MVC Application.

I have a list of objects where each object contains a url and refreshTime. Application should present a table where each row represent each object from list. For each row it has to check if the url is still avaiable. Each row have different refreshTime.

My problem is that I dont know how to do this using Javascripts. I tried using jQuery, Ajax but I failed. I know how to refresh all table using Js, but how to refresh each row in separately using different refresh Time for each of them?

Upvotes: 1

Views: 2258

Answers (1)

Markus-ipse
Markus-ipse

Reputation: 7396

if you have the following table:

<table border=1>
    <thead>
        <td class="url">Url</td>
        <td class="interval">Interval</td>
        <td class="status">Status</td>
    </thead>
    <tbody>
        <tr>
            <td class="url">http://www.google.com</td>
            <td class="interval">2000</td>
            <td class="status"></td>
        </tr>
        <tr>
            <td class="url">http://www.bing.com</td>
            <td class="interval">5000</td>
            <td class="status"></td>
        </tr>
    </tbody>
</table>

you can use the following jQuery snippet to update each row individually:

$("tbody tr").each(function () {
    var row = $(this);
    var interval = row.find(".interval").text();
    setInterval(function(){updateRow(row);}, interval);
});


function updateRow(row) {
    var url = row.find(".url").text();
    var statusCell = row.find(".status");

    statusCell.text("last checked: " + new Date().toLocaleString());

    var checking = $.post('/api/statuses', { "": url });

    checking.done(function (data) {
        var responding = data;
        if (responding) {
            statusCell.css("background", "green");
        } else {
            statusCell.css("background", "red");
        }
    });
}

Also available at http://jsfiddle.net/hummlas/pyh9c/

The actual status check is a bit more complex though as your not allowed to make cross-domain ajax calls, you could get around that by using a proxy, e.g. creating some server-side code that will do the status check, and then you'll just ajax call your proxy with the url you want the get the status of.

Edit:

I've added an example implementation of a status checking proxy service using a ASP.NET Web API controller

public class StatusesController : ApiController
{
    [HttpPost]
    public bool Post([FromBody]string value)
    {
        return CheckStatus(value);
    }

    private bool CheckStatus(string url)
    {
        var request = (HttpWebRequest)WebRequest.Create(url);
        request.Method = "HEAD"; //only retrieve headers

        HttpWebResponse response;
        try
        {
            response = (HttpWebResponse)request.GetResponse();
        }
        catch (WebException e)
        {
            response = (HttpWebResponse) e.Response;   
        }

        var responseCode = (int)response.StatusCode;
        return responseCode < 400; //erroneus response codes starts at 400
    }

}

Upvotes: 1

Related Questions