Ajax Calls not Accessing Server Side

Question

I am confused why my Ajax call is not working. Currently, I just need my Ajax method from Client to access my Controller Method. The alert command is POPING on my HTML But server side is not accessed from Client. Please advise what am I missing in following:

1. Calling my Controller's Action Method Get Data

   <script>
   $(document).ready(function () {
         $.get("@Url.Action("GetData","Driver")",function(data){
         $("#dataForSecond").html(data);
         alert("Second ActionResult");
     });
   });
   

2. Get Data Method in my Controller just returns:

    public ActionResult GetData()
   {
       logger.AddLog("INTO 2nd Action Method");
       var secondData = "I m Dummy";
       //System.Threading.Thread.Sleep(500);
       logger.AddLog("Setting loggedInAgent Value Again");
      // ViewBag.loggedInAgents = "11";
       return Json(secondData, JsonRequestBehavior.AllowGet);
   }
   

3. For testing I did following in Client side but no REFRESHING took place, only a POP up as before. Whats going on with my code, I have no clue.

   $(function () {
       var refreshInterval = 5000;
       var url="@Url.Action("GetData","Driver")";
       setInterval(function () {
       $("#View1").load(url);
       }, refreshInterval);
   

Answer 1

You are calling ActionResult, you need to call JsonResult that's why is not working, see an example bellow:

             $.ajax({
                url: '/Product/List',
                type: "GET",
                data: { "nrRecs": 4 },
                async: true,
                dataType: "json",
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                       alert('error');
                },
                success: function (data) {
                    alert('ok');
                }
            });


    [HttpGet]
    public async Task<JsonResult> List(int nrRecs)
    {
        var product = db.products.Take(4);
        return Json(await product.ToListAsync());
    }