Grid rendering Issue

[Murugan]

In the MVC page, the below grid is not rendering.. 

  @{Html.Syncfusion().Grid<Person>("GridData")
                   .Datasource((IEnumerable<Person>)ViewData["Employeedata"])
                   .Column(cols =>
                       {
                           cols.Add(c => c.FirstName).HeaderText("Employee Name").Width(500);
                       })
                    .EnablePaging()
                    .Render();
            }

When I check the view source in the IE, the below content has been rendered. Can you please let me know what I am missing in the design time?

<link rel='nofollow' href="/MvcResourceHandler.axd?k=css&r=['282287209','-1551797839','1489007596']&minify=true" id="GridMarble" reg="0" rel="stylesheet" /><div id="GridDatawaiting" style="display : none;"><div id="GridDatawaiting_WaitingPopup_Panel" style="width: 100%;height: 100%;background-position: center center;opacity : 0.4; filter: alpha(opacity= 40); background-color:#fdffff;"></div><img id="GridDatawaiting_WaitingPopup_Image" src="/MvcResourceHandler.axd?k=img&r=gbwjpbqMlCJ9MAp4aOJ5//p89Hibq6RCsmFGRuTOMiHM8WHgA5AdNgiRmcA6LuDq6mnQfmjF5d9wrRvK7lzHlNYKnmztoAj84UnyNm2qh8BrtXDE5O1tR33uY_YWdkMhjuQ8Kfm4BRX0BRHQvDE6Jg6VmqhJ4XVPdGBjknxcoe9k77R6NMpIMcdfzJxMkXumNojRZr1MjnDY1EfPfE_tzsvESOK_GYeD" /></div><div class="Syncfusion-Grid-Core Syncfusion-Grid-Marble" id="GridData" style="visibility:hidden" tabindex="100"><div class="GridHeader"><div class="Hdr-widthSettings"><table cellspacing="0.25px" class="Table"><colgroup><col style="width:20px" /><col style="width:500px" /></colgroup><thead><tr class="HeaderBar"><th class="TopLeftCell"> </th><th class="HeaderCell"><div class="HeaderCellDiv">Employee Name</div></th></tr></thead><tbody style="display:none"><tr><td></td><td></td></tr></tbody></table></div></div><div class="GridContent"><div><table cellspacing="0.25px" class="Table" id="GridData_Table"><colgroup><col style="width:20px" /><col style="width:500px" /></colgroup><tbody><tr><td class="RowHeader"><div> </div></td><td class="RowCell">Employee 1</td></tr><tr><td class="RowHeader"><div> </div></td><td class="RowCell">Employee 2</td></tr><tr><td class="RowHeader"><div> </div></td><td class="RowCell">Employee 3</td></tr></tbody></table></div></div><div class="GridPager"><div class="gridPagerContainer"><div class="FirstPageDisabled first"></div><div class="PrevPageDisabled prev" style="margin-left:2px"></div><a class="NextPrevItemDisabled Spacing PP">...</a><div class="NumericContainer" id="NumericContainer"><a class="CurrentItem NumericItem Spacing">1</a><a class="NumericItem Spacing">2</a><a class="NumericItem Spacing">3</a><a class="NumericItem Spacing">4</a><a class="NumericItem Spacing">5</a><a class="NumericItem Spacing">6</a><a class="NumericItem Spacing">7</a><a class="NumericItem Spacing">8</a><a class="NumericItem Spacing">9</a><a class="NumericItem Spacing">10</a></div><a class="Spacing NP">...</a><Div class="NextPageDisabled"></Div><Div class="LastPageDisabled" style="margin-left:2px"></Div><div class="RefreshPager" style="display:inline-block"></div></div><div class="ParentMsgBar" style="text-align:right"><span class="MsgBar" style="height:5px"></span></div></div></div>

[Murugan]

I have fixed the visibility issue..but when I click on next page, getting the below javascript error.

Microsoft JScript runtime error: Unable to get value of the property 'tHead': object is null or undefined.

Can someone share your ideas to fix this issue?

[Rakesh D]

 

Hi Murugan,

 

Thank you for your interest in Syncfusion products.

 

Query : Grid rendering Issue ?

 

Based on the information provided we suspect that you have not added action method for Post action. We need to add two action methods in the Controller (one for loading the view and one for handling the grid paging and sorting actions). Please refer below code snippet for further details.

 

[Controller]

 

public ActionResult ServerMode()

        {

            var data = new GridSample_Server.Models.StudentDataContext().Student.Take(100).ToList();

            ViewData["ProductName"] = "Grid";

            return View(data);

 

        }

 

        [AcceptVerbs(HttpVerbs.Post)]

        public ActionResult ServerMode(PagingParams args)

        {

            IEnumerable data = new GridSample_Server.Models.StudentDataContext().Student.Take(100).ToList();

            return data.GridActions<GridSample_Server.Models.Student>();

        }

 

 

Please refer our below online documentation link for more details on how to add grid to mvc application.

 

http://help.syncfusion.com/ug/asp.net%20mvc/grid/default.htm#!documents/519howdoiaddessentialgridtothesimplerazorapplication.htm

 

 

For your convenience we have prepared a sample for the above scenario and it is attached below. Please refer to it.

 

 

Please let us know if you have any concerns.

 

Regards,

Rakesh D

 

 

GridSample_Server_dce5ecf9.zip

[Manne]

Hi,

 I am also facing the visibility problem for the grid. how do you fixed that one? Can you please explain

Thanks

Manne

[Prabu Sarvesan]

Hi Manne,

 

Thanks for your interest in Syncfusion products.

 

We are unable to reproduce the issue “Grid Invisibility”. We have prepared a simple sample and the same can be downloaded from below link.

 

Sample Link:

 

http://www.syncfusion.com/downloads/support/directtrac/general/SampleGrid1441557442.zip

 

Could you please send us more information about the issue whether the console window of firebug has any errors or send us a sample with issue so that we could sort out the cause of the issue and provide you a better solution quickly? The information provided would be great help for us to resolve your issue.

 

Also could you please confirm whether you have added script manager at the end of Layout.csthml page? Please refer the following code snippets.

 

Code Snippets:

 

[Layout.cshtml]

 

<html>

…

<body>

…

@{Html.Syncfusion().ScriptManager().Combine(true).Minify(true).Render();}

…

</html>

 

However the “How to avoid Grid invisibility” documentation resolves the common invisibility issues. So we suggest you to follow the steps in it once again correctly and the link as follows:

 

Documentation link:

http://help.syncfusion.com/ug/asp.net%20mvc/grid/documents/howtoavoidgridinvisi.htm 

 

Please let us know if you need any further assistance.

 

Regards,

 

Prabhu Sarvesan