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

Empty Grid div in ajax reponse

Hi,

I have two grids in a partial view, which are supposed to be updated on button click.

I am making an ajax call and trying render the html of the container div in success.

object in the controller is getting the data. However, response in the success function is returning the div's of two grids as empty.

I have tried all the solutions in the following link...But didn't work

https://www.syncfusion.com/forums/116929/partialview

I have also tried to return json as below. The grid content is changing as expected but not the Columns.

I have attached screenshots of ajax call and response alert.


var query = new ej.Query().addParams("Index", index).addParams("Value", value).addParams("data", grade).addParams("FineGrade", fineKey.toString()).addParams("FineValue",fineVal);
        var ResultsGrid = ej.DataManager({ url: "/School/ResultsData", adaptor: new ej.UrlAdaptor() });
        var promise = ResultsGrid.executeQuery(query);
       
        promise.done(function (e) {
            alert("success");
            gridObj.dataSource(e.result.ListOfTables[0],true);
            
            MainGrid.dataSource(e.result.ListOfTables[1],true);
           
        });

Attachment: grid_509c0ad1.zip

1 Reply

KK Karthick Kuppusamy Syncfusion Team October 27, 2016 01:57 AM UTC

Hi Indrani, 
Thanks for Contacting Syncfusion support. 
We have analyzed the issue that you have mentioned. For your convenience, we have created a simple sample with partial view to repopulate the data within the div using the ajax call.Please find the code example as below.  
[In index.cshtml] 
<div id="main"> 
@Html.EJ().Button("click").Text("Render Grid").Render() 
@Html.Partial("_partial"this.ViewData) 
    </div> 
  
<script type="text/javascript"> 
    $("#click").click(function () {         
        $.ajax 
                ({ 
                    url: "Home/Productpartial", 
                    type: 'GET', 
                    success: function (data) {                        
                        $("#main").html(data);                        
                    } 
                }); 
    }); 
</script> 
  
[In controller] 
        public ActionResult Productpartial() 
        { 
            var DataSource = new NorthwindDataContext().EmployeeViews.ToList(); 
            ViewData["datasource"] = DataSource; 
            return PartialView("_partial",ViewData); 
        } 
  
 
Could you please share the following details to us it would be helpful for us to find the solution at earliest. 
1.Please reproduce the issue in the attached sample and revert back to us if possible or share more information to reproduce the issue at our end. 
2.Did you faced any script error if any please share the screenshot . 
Regards, 
K.Karthick. 


Loader.
Up arrow icon