Hi
I am unable to get the 2013.1 IngiteUI grid working on my VS2012 ASP.NET MVC 4.0 Razor project. The documentation seems to refer to older versions of the component.
I have the following code in my _Layout.cshtml head..
@Styles.Render("~/Content/css") @Styles.Render("~/Content/themes/base/css")
<link href="@Url.Content("~/igniteui/css/themes/infragistics/infragistics.theme.css")" rel="stylesheet" /> <link href="@Url.Content("~/igniteui/css/structure/infragistics.css")" rel="stylesheet" />
@Scripts.Render("~/bundles/modernizr") @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryui")
<!-- Ignite UI Required Combined JavaScript Files --> <script src="@Url.Content("~/igniteui/js/infragistics.core.js")"></script> <script src="@Url.Content("~/igniteui/js/infragistics.lob.js")"></script>
And the following in my view...
@( Html.Infragistics() .Grid<Venue>() .ID("VenueGrid") .AutoGenerateColumns(true) .Height("500") .DataSourceUrl(Url.Action("VenueGridGetData")) .Render())
When i run it I get the error..
Object doesn't support this property or method at the igGrid java script call.
Please would it be possible for you to create a VS2012 ASP.NET MVC Razor sample that uses the grid. The javascript and CSS files folder structure for the component have changed so it definitely appears to be out of date.
Hi Michael,
The order of the script references looks correct for 13.1. You can receive that error when one of the script files fails to load. I recommend using the developer tools to determine if any of the script requests are failing with 404 errors as your first step to debug. I also see that you are using the built-in ASP.NET script minification so you should double check that is configured correctly. Here are some instructions for Chrome and IE:
Chrome
https://developers.google.com/chrome-developer-tools/docs/network
IE
http://msdn.microsoft.com/en-us/library/ie/hh968260(v=vs.85).aspx#NetworkTab
Also, can you provide a link to the help documentation that you saw was incorrect? Thanks.
Hi Aaron,
I will check that out. I am using IE8 so will need to upgrade to IE9. Could IE8 be a problem ?
Last week Michael H. replied and said he would generate a sample by Tuesday. I would be grateful if he still could so I can be sure that it is my setup that is a problem rather than a bug in the control.
As far as the documentation is required please see..
http://help.infragistics.com/Help/NetAdvantage/jQuery/2013.1/CLR4.0/html/igGrid_Overview.html
It refers to...
<script src="scripts/infragistics.js" type="text/javascript"></script>As far as I can see this file does not exist anymore in 13.1. Perhaps this file existed in v12 ?
script
src
"scripts/infragistics.js"
type
"text/javascript"
</
>
Hi Martin,
Thanks but after 2 very frustrating weeks trying to get the igGrid to work correctly with ASP.NET MVC I have now given up. I just installed the free Grid.Mvc from CodePlex and after one hours work, I have it working with my data access code - no server error.
In addition, it has the ability for me to place custom fields in the grid with ease, such as an ActionLink edit field which the igGrid doesn't seem to support without a lot of additional client side javascript.
And it supports the ability to add in custom filter widgets such as a customer combo displaying all customer names in the grid.
My company has paid for Infragistics components and I am quite frustrated that a free control seems to work better for me than the paid for igGrid. I have made more progress in one hour with Grid.Mvc than I made in two weeks with the igGrid.
If there is anything else we can do to help, please let us know. I want to give a couple more bits of information that might help for anyone following this post.
Using a network profiler, as Martin suggested, is the next best step to debugging this issue to know the specific error you may be seeing. A common issue when using EntityFramework is an error similar to this: 'A circular reference was detected while serializing an object...'.
The igGrid uses JSON serialization to transfer your data objects from the server to the client. (It doesn't look to me like Grid.MVC does this, which might partly explain your results). EntityFramework was intended to be a rich in-memory set of objects representing a data layer and with this comes a very complex object model. When trying to serialize this object model to JSON, the circular reference error can occur.
The recommendation here is to put a layer in between your Entity Data Model and your View using a collection of Data Transfer Objects. These would be very simple POCOs (Plain old CLR Objects) that would exist for the purpose of being serialized for your view. You can manually create these collections yourself from your Entity collections or there is also a popular framework called AutoMapper to help with this type of work that I have used successfully in my projects.
This is what I think *might* be going on here. I've forwarded the post over to the team to investigate further how we can improve the experience. Any further implementation details you can provide would be very helpful in this endeavor.
Please let us know if there is anything more we can do to help.
Thanks for the detailed response.
I do believe that the issue is to do with relationship between my entities. Yes, I read about the circular reference issue last week and added code to switch on lazy loading and switch off proxy class creation.
public ActionResult EnquiryGridGetData()
{
db.Configuration.LazyLoadingEnabled = true;
db.Configuration.ProxyCreationEnabled = false;
var query = from e in db.Enquiries.Include("Customer")
orderby e.Id
select e;
return View(query);
}
But this didn't fix the issue. However, if I don't include Customer and drop the customer column from the grid it does work.
Last week during my experiments I did actually do what you say and I created some DTO's or ViewModel classes. I used AutoMapper to populate these automatically but unfortunately the downside of this is that you need to create an IList rather than IQueryable as AutoMapper needs to instantiate the instances rather than generate the query. This means that the whole data set is pulled from the database which has a negative performance impact.
I tried generating an IQueryable of my ViewModel manually but still got the data fetch issue.
My final thoughts on this are that the IQueryable grid handling works if you don't have a parent-child relationship. But parent-child relationships are going to be so common for me I need this to work.
I don't know how Grid.Mvc is doing the data transfer from server to client under the covers but it is working my Enquiry/Customer relationship. And at the moment I have wasted a lot of time on this that using a 3rd party control was meant to bypass.
I think you should look at some of the features of the Grid.Mvc and consider implementing them in igGrid as these are important tools which are lacking from igGrid. You may be able to implement them but I cannot see how you can do so easily from the documentation...
Custom Filter Widgets...
http://gridmvc.codeplex.com/wikipage?title=Creating%20custom%20filter%20widget&referringTitle=Documentation
Not Connected Columns (eg. adding an Edit column with an Edit Action Link to each row)
http://gridmvc.codeplex.com/wikipage?title=Custom%20columns&referringTitle=Documentation
Anyway thanks for your help.
Thanks for taking the time to write your feedback. I wanted to let you know that I did forward this thread over to the product team and product management for further research and one of our principal architects is looking at it as well.
Thanks again and best of luck!
No bother. Thanks for your help Aaron.