How to implement AJAX based polling in ASP.NET MVC application to get changes from database

Question

0.00/5 (No votes)

See more:

I want to implement AJAX based polling to get the changes made in the database without refreshing the page. Can anyone please suggest me how to do this? I do not have any idea.

Please provide me with some sample solutions.

Thank you in advance.

What I have tried:

I do not have any idea how to implement this.

Posted 16-Nov-17 9:59am

Rajeshyadav12

Updated 17-Nov-17 6:55am

Add a Solution

Comments

W∴ Balboos, GHB 17-Nov-17 14:17pm

Solution notwithstanding, keep in mind how many of these will be running at any given time and the network traffic that might cause. One person - no big deal. The Web is stateless for a reason.

Member 11556103 24-Sep-18 9:01am

hhhhh

Member 11556103 24-Sep-18 9:01am

jjkklkk

Member 11556103 24-Sep-18 9:02am

xvdxvdf

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Karthik_Mahalingam · Accepted Answer · 2017-11-16T16:33:00

Solution 1

try this

<script>

    var interval = 5; // 5 seconds
    interval = interval * 1000;
    var obj = {}; // specify the parameters
    window.setInterval(poll, interval);
    function poll() {
        $.ajax({
            url: "/ControllerName/YourActionName",
            type: "POST",
            data: obj,
            dataType: "json",
            traditional: true,
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                // process the data
            },
            error: function () {
                alert("An error has occured!!!");
            }
        });
    }

</script>

[HttpPost]
      public ActionResult YourActionName() {
          object data ;
          // Your logic to get the data from DB
          return Json(data);
      }

refer jQuery.ajax() | jQuery API Documentation[^]
Window setInterval() Method[^]

Posted 16-Nov-17 16:33pm

Karthik_Mahalingam

Comments

Rajeshyadav12 19-Nov-17 17:10pm

@karthik,I do not have an idea what to put under var obj = {}; and success: function (data) {
// process the data
},

My controller returns:

[HttpPost]
public ActionResult GetStatus()
{
TestHandle sdb = new TestHandle();

return Json(sdb.GetPhoneData());
}

And my View is something like this:

@model IEnumerable<testproject.models.test>

@foreach (var item in Model)
{
@Html.DisplayFor(modelItem => item.FName)
@Html.DisplayFor(modelItem => item.LName)

}

var interval = 5; // 5 seconds
interval = interval * 1000;
var obj = {Id}; // specify the parameters
window.setInterval(poll, interval);
function poll() {
$.ajax({
url: '/Home/GetStatus',
type: "POST",
data: obj,
dataType: "json",
traditional: true,
contentType: "application/json; charset=utf-8",
success: function (data) {
debugger;
Id = data.Id
// process the data
},
error: function () {
alert("An error has occured!!!");
}
});
}

I am using partial view named "GetStatus" and want it display the changes made in the database without refreshing the page. Please guide me. Thank you Karthik.

Karthik_Mahalingam 19-Nov-17 22:25pm

if you dont have any parameter the leave this as it is
var obj = {};
and
success: function (data) {
in the data object you will get the response from the server, so you can whatever you want with the data.

I am using partial view named "GetStatus" and want it display the changes made in the database without refreshing the page.
ok write the code in the view

Rajeshyadav12 19-Nov-17 22:34pm

@Karthik, Please guide me. I have already pasted the code on the top. I want to display all the data from the table upon any changes. Please help me.

Rajeshyadav12 19-Nov-17 22:29pm

@Karthik, I have already written this code in GetStatus.cshtml. But this is throwing an error alert("An error has occured!!!"); I have pasted my code on the top. Please guide me.

Karthik_Mahalingam 19-Nov-17 22:34pm

see the exact error message, by using the below code.

 error: function(xhr, status, error) {
    alert(xhr.responseText);
 }

Rajeshyadav12 19-Nov-17 22:40pm

The error message is " The resource can not be found".

Karthik_Mahalingam 19-Nov-17 22:41pm

make sure you have a controller named "Home" and the method named "GetStatus"
since you are calling this
url: '/Home/GetStatus',

Rajeshyadav12 20-Nov-17 4:47am

@Karthik, URL is same as you have written. Please check the above code. Thank you.

Karthik_Mahalingam 20-Nov-17 7:24am

try
url: 'Home/GetStatus',

Member 11556103 24-Sep-18 9:00am

adsad

Member 11556103 24-Sep-18 9:00am

aaaaaaa