Html table getting repeated randomly on page load

Question

I created a MVC application which works fine except for an issue on page load. I am using partial view to display html table on my page. I have used paging in which 10 records are getting displayed on each page.

Paging is working fine on all the pages but on page load at first 10 records are getting displayed correctly but within a fraction of second, these 10 records are getting repeated randomly.

I have debugged the code properly but was unable to find any issue with the code. I have tested the application in IE and Chrome but getting the same repetition on page load.

Please help me to know the possible reason for this. Updating with code, have removed the unnecessary code. Code:

Controller:

[OutputCache(NoStore=true, Duration = 0)]
public ActionResult Index()
     {
            try
                    {
                           List<FundVM> lst = GetAllFunds(1, 2);
                            return View(lst);
                     }
            catch (Exception ep)
                    {
                             Logger.Error("Loging error---" + ep.StackTrace + "\n---------Message-----------\n" + ep.Message + "\n----------InnerException----------\n" + ep.InnerException);
                    }
              return View();
             }

public ActionResult GetFundList(int pageno, int pagesize) { try { List lst = service.GetAllFunds(pageno, pagesize); int count = lst.Count;

                 ViewBag.pageno = pageno;
                 ViewBag.pageSize = pagesize;

                 if (count < 1)
                    {
                          return Json(new { success = true, message = "You are on the last page" });

                     }
                     return View("PartialDataView", lst);
        }
        catch (Exception ep)
              {
                   Logger.Error("Loging error---" + ep.StackTrace + "\n---------Message-----------\n" + ep.Message + "\n----------InnerException----------\n" + ep.InnerException);
               }
        return View();
    }

GetAllFunds:

public List<FundVM> GetAllFunds(int pageno, int pagesize)
           {
                    List<FUND> lst = new List<FUND>();
                    int startRecord = ((pageno - 1) * pagesize);
                    int endRecord = pagesize * pageno;
                    if (startRecord < 0)
                              {
                                    //return 1;
                               }
                      else
                                    {
                                        lst = (from mf in db.FUNDs
               orderby mf.Id
               select mf).Skip(startRecord).Take(pagesize).ToList();
                                      }
                          return ConvertListtoVM(lst);
}

Jquery for paging:

 function CallFundData(pageno) 
           {
                  var pagesize = 10;
                  $.ajax({
                          url: "/Fund/GetFundList",
                          data: { pageno: pageno, pagesize: pagesize },
                          type: "post",
                          success: function (res) {
                                 if (pageno < 1) 
                                           {
                                              $('.#btnPrevious').disableSelection();
                }
                else if (res.success) 
                           {
                    $('.#btnNext').disableSelection();

                }
                else
                              {
                                   $('#datadiv').html(res);
                                   $('#txtPageNo').val(pageno);
                               }
            },
                           error: function ()
                                        {
                                               alert("PageNo required");
                                          }
         });
    }

View:

calling partial view:

<div id="datadiv">
        @Html.Partial("~/Views/Fund/PartialDataView.cshtml", Model)
</div>

Partial View:

       <tbody>
                      @foreach (var mf in @Model)
                                  {
                                            <tr>
                                               <td>@mf.Fee</td>
                                          </tr>
                               }
        </tbody>

How are you loading partial view. What is your paging mechanism. There is no default mechanism in mvc. — Amit Kumar Singh

Aryan Sinha Aryan Sinha · Accepted Answer · 2017-09-22T07:55:10

Solved the issue by removing the code "@Html.Partial("~/Views/Fund/PartialDataView.cshtml", Model)" from View and calling the CallFundData(1) inside $(document).ready(function () {} of Jquery.

Html table getting repeated randomly on page load

1 Answers