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"
</
>
I have attached my sample to this post. Please find the link below. I had to make several changes to my sample for file size limitations to upload it. Please see below for any instructions you should need to handle.
Using the code you provided, I worked a simple sample around it. I changed the way the data is bound as this should be unrelated to the error you are receiving.
I have a folder named igniteui in the app folder. It included the IgniteUI js and css folders, which I had to remove. You can replace these with the files from your version. I added a reference to the Infragistics.Web.Mvc ver. 4.13.1.2039 (MVC 4, IgniteUI 13 Vol. 1 build 2039) assembly and set the CopyLocal property to true. I also removed any packages, which can be restored with NuGet.
We have also logged an issue to address the documentation being outdated. Thank you for pointing it out.
If you need further assistance with this, please let me know and I will be glad to help.
Thanks for your assistance.
Unfortunately I get the same issue when I run your project. However you say you are using Ignite UI 13 Vol. 1 build 2039 whereas I have Ignite UI 13 Vol 1. build 1012 so perhaps this is the issue.
When I login to my account the only downloads available for Ignite UI 2013 Vol 1 are v20131.1012 from 16-Apr-2013.
Where can I download build 2039 from ?
Any idea where I can download build 2039 from ?
Really need to make progress on this project now. Getting hassle from management!
Thanks
You can find the latest service releases under your account's Keys & Downloads page. https://ko.infragistics.com/my-account/keys-and-downloads/
Select the product you have installed from the table and click on the Service Releases tab that appears along the bottom to find the download for the latest update.
If you need further assistance with this issue, please let me know.
Hi,
Got this now thanks. Ok situation moved forward a bit.
If I define the grid to work from a List<VenueSummary> where I pull from my EF Venue DBSet and construct the list ie. full table load rather than IQueryable it works.
However that is very inefficient. I want to use the DBSet<Venue> directly as it is an IQueryable<Venue> which means only the displayed data should be loaded from the DB (rather than the full 7000 records!). However, when I pass the DBSet then it fails with this error....
"Microsoft JScript runtime error: The remote request to fetch data has failed: (error) undefined"
Any ideas ?
No bother. Thanks for your help Aaron.
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!
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.
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.
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.