We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
  1. Home
  2. Forum
  3. ASP.NET MVC
  4. Refresh Grid in Partial view

Refresh Grid in Partial view

I have a little problems with refreshing data in asp.net mvc grid which is inside a partial view. 

This is my grid in partial view:
<div class="row">
    <div class="col-md-12">
        @(Html.EJ().Grid<recognitions>("gridRec")
        .Datasource((IEnumerable<recognitions>)ViewBag.dsRec)
        .IsResponsive()
        .AllowSelection(false)
        .EnableAltRow(true)
        .Columns(col =>
        {
            col.Field("source_id").HeaderText("source_id").TextAlign(TextAlign.Right).Width(75).Add();
            col.Field("plate_text").HeaderText("plate_text").TextAlign(TextAlign.Right).Width(75).Add();
            col.Field("country_assumed").HeaderText("country_assumed").Width(80).Add();
            col.Field("confidence_level").HeaderText("confidence_level").TextAlign(TextAlign.Right).Priority(2).Width(75).Add();
            col.Field("complete_image_url").HeaderText("complete_image_url").TextAlign(TextAlign.Right).Width(75).Priority(3).Format("{0:C}").Add();
            col.Field("date").HeaderText("date").TextAlign(TextAlign.Right).Width(75).Format("{0:dd.MM.yyyy. hh:mm:ss}").Add();
            col.HeaderText("plate_image").Template("<img src='data:image/jpeg;base64,{{:plate_image_url}}' />").TextAlign(TextAlign.Center).Width(100).Add();
        })
        )
    </div>
</div>

This is in my controller:
public ActionResult Rec()      // This is for oppening partial view from main view
{
var lstRec = new ANPREntities().recognitions.OrderByDescending(r => r.date).ToList();
foreach (var item in lstRec)
{
item.plate_image_url = Convert.ToBase64String(System.IO.File.ReadAllBytes(item.plate_image_url.ToString()));
}
ViewBag.dsRec = lstRec;
lstRec = null;
return PartialView("_IndexRec");
}

[HttpGet]
public JsonResult GetRec()   // This is for get just the data for the grid
{
var lstRec = new ANPREntities().recognitions.OrderByDescending(r => r.date).ToList();
foreach (var item in lstRec)
{
item.plate_image_url = Convert.ToBase64String(System.IO.File.ReadAllBytes(item.plate_image_url.ToString()));
}
return Json(lstRec, JsonRequestBehavior.AllowGet);
}

JS in main view for updating the grid is this:
var obj = $("#gridRec").data("ejGrid");

$.ajax({
url: '@Url.Action("GetRec", "Home")',
type: "get",
}).done(function (data) {
obj.dataSource(data);
}).fail(function () {
alert('error');
});

So, why is refreshing the grid works only once? :(

Thanks!

6 Replies
PK Prasanna Kumar Viswanathan Syncfusion Team September 5, 2016 06:02 AM UTC

Hi Bernard, 

Thanks for contacting Syncfusion support. 

We checked in our sample with refreshing data inside a partial view using a button click. While refreshing the grid data we did not face any issues in our sample.  

Find the code example and sample: 

 
@Html.EJ().Button("buttonnormal").Text("Refresh").Size(ButtonSize.Normal).ClientSideEvents(e => e.Click("click")) 
 
<div> 
    @Html.Partial("Grid") 
</div> 
 
<script> 
    function click() { 
        var obj = $("#FlatGrid").data("ejGrid"); 
 
        $.ajax({ 
            url: '@Url.Action("DataSource", "Home")', 
            type: "get", 
        }).done(function (data) { 
            obj.dataSource(data); 
        }).fail(function () { 
            alert('error'); 
        }); 
    } 
</script> 
 
--------------------------------------------------------- 
<div class="row"> 
    <div class="col-md-12"> 
        @(Html.EJ().Grid<object>("FlatGrid") 
.Datasource((IEnumerable<object>)ViewBag.datasource) 
.IsResponsive() 
.AllowSelection(false) 
.EnableAltRow(true) 
.AllowPaging() 
.Columns(col => 
{ 
    ------------------------- 
}) 
        ) 
</div> 
    </div> 
 


To reproduce the issue, we need the following details, 

1. Share the screenshot of problems that you are facing in your sample. 

2. Did you face any script error in your sample? If yes, share the Stackrace of a script error. 

3. Essential Studio Version details. 

4. If possible, reproduce the issue in the attached sample. 

Regards, 
Prasanna Kumar N.S.V 


BJ Bernard Jurlina September 6, 2016 08:18 PM UTC

Hi, and thanks for the answer.

It seems that I only have this problem with Internet explorer. When I run my project with Edge or Chrome, the grid refreshes every time.
Hm, IE is one strange thing. :)

Thanks again!
Bernard.

PK Prasanna Kumar Viswanathan Syncfusion Team September 7, 2016 04:16 AM UTC

Hi Arun, 

Thanks for the update.
  
Please let us know if you need any further assistance. 

Regards, 
Prasanna Kumar N.S.V 


PK Prasanna Kumar Viswanathan Syncfusion Team September 7, 2016 05:52 AM UTC

Hi Bernard, 

Please ignore the previous update. 

We checked with our sample with IE browser and grid refreshes every time in our sample.  

For your convenience we attached a video and download the video from the following link 


We suspect that the issue is due to the cache problem in IE.  If we make Ajax queries with same URL, it tends to give the same result/output as IE caches the data that it gets from first query. 

To avoid this issue, set cache as false in the Ajax call. 
 
Find the code example: 
 

$.ajax({ 
    cache : false, 
---------------------------------- 
}); 

For more information refer the below link 


Regards, 
Prasanna Kumar N.S.V 

 


BJ Bernard Jurlina September 7, 2016 06:27 AM UTC

Hello again!

Yes, I tried with cache: false and it works.

Thank you so much for the update.

Regards,
Bernard.

PK Prasanna Kumar Viswanathan Syncfusion Team September 8, 2016 04:00 AM UTC

Hi Bernard, 

We are happy that the provided solution is working fine at your end.  
 
Please let us know if you need any further assistance. 
 
Regards, 
Prasanna Kumar N.S.V 


Loader.
Up arrow icon