MVC Creating Infragistics grid in strongly-typed View

Question

MVC Creating Infragistics grid in strongly-typed View

1.3k views Asked by Omar At 26 August 2014 at 13:27

I have one view (ViewLeads) that only has an Infragistics grid already working and pulling data fine. I have another view (UpdateLead) where I have several textboxes which display the data in the grid when you click on a specific user.

What I want to do is add the infragistics grid to this new view (UpdateLead). The issue I'm running into is that in my first view(ViewLead) my model reference is...

@model IQueryable<LeadManagement.BusinessEntities.BusinessLead>

and further down I have my grid like..

 @(Html.Infragistics()
            .Grid(Model)
            .ID("grid123")
            .Width("100%")
            .PrimaryKey("Lead_ID")
            .AutoGenerateColumns(false)
            .AutoGenerateLayouts(false)
            .Columns(column =>
            {


                column.For(x => x.Lead_ID).Hidden(true);
                onclick='return true;' />", "Lead_ID", "string", "3%") { Template = "<input type='checkbox' name='select'/>" });
               style='color:blue;'>${Name}</a>").HeaderText("Name").Width("10%");
                style='color:blue;'>${Name}</a>").HeaderText("Name").Width("10%");
                column.For(x => x.Name).Template("<a href='UpdateLead?id=${Lead_ID}' style='color:blue;'>${Name}</a>").HeaderText("Name").Width("10%");
                column.For(x => x.LeadCreationDate).HeaderText("Created").Width("8%");
                column.For(x => x.Source).HeaderText("Source").Width("10%");
                column.For(x => x.status).Template("<a href='#' style='color:blue;'>${status}</a>").HeaderText("Status").Width("10%");
                column.For(x => x.Note).HeaderText("Notes").Width("10%"); 
                column.For(x => x.Litigation).HeaderText("Type of Litigation").Width("12%");
                column.For(x => x.originalFirm).HeaderText("Original Firm").Width("13%");
                column.For(x => x.CurrentFirm).HeaderText("Current Firm").Width("13%");
                column.Columns.Add(new GridColumn("Accept/Deny/Transfer", "Lead_ID", "string", "18%") { Template = "<input type='image' src='/Images/Accept.jpg' height='20' width='20' onclick='return Accepted(${Lead_ID})'/>&nbsp;&nbsp;&nbsp;<input type='image' src='/Images/Reject.png' height='20' width='20' onclick='return Rejected(${Lead_ID})'/>&nbsp;&nbsp;&nbsp;<input type='image' src='/Images/Transfer.png' height='20' width='20' id='InputAssignLead' onclick='return AssignLead(${Lead_ID})'/>" });
            })

NOW...

On my other View (UpdateLead) since I have textboxes and stuff that I'm populating my model reference is..

@model LeadManagement.BusinessEntities.BusinessLead

and so when I try to copy my Grid code over to this view, it complain about the

.Grid(Model)

part, saying it has invalid argument, and Vice Versa if I change the model refernce to an Iqueryable reference the textboxes complain.

How can I have both on the same page (textboxes and grid)???? I've tried referencing both model types but that doesn't work either. I've been stuck on this for a couple days now. Thanks in advance!!

Original Q&A

There are 1 answers

**Antonio M** · Answer 1 · 2016-10-26T13:13:14+00:00

There could appear such problem when you didn't mentioned:

@using Infragistics.Web.Mvc

and your model like in example below

@using IgniteUI.SamplesBrowser.Models

    @model IQueryable<IgniteUI.SamplesBrowser.Models.Northwind.Product>
<!DOCTYPE html>

<html>
<head>
    <title></title>

    <!-- Ignite UI Required Combined CSS Files -->
    <link href="http://cdn-na.infragistics.com/igniteui/2016.2/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
    <link href="http://cdn-na.infragistics.com/igniteui/2016.2/latest/css/structure/infragistics.css" rel="stylesheet" />

    <script src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

    <!-- Ignite UI Required Combined JavaScript Files -->
    <script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/infragistics.core.js"></script>
    <script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/infragistics.lob.js"></script>

</head>

<body>
        @(Html.Infragistics()
            .Grid(Model)
            .ID("grid")
            .Width("100%")
            .Height("500px")
            .PrimaryKey("ID")
            .AutoGenerateColumns(false)
            .AutoGenerateLayouts(false)
            .Columns(column =>
            {
                column.For(x => x.ProductName).HeaderText("Product Name").Width("30%");
                column.For(x => x.CategoryName).HeaderText("Category").Width("30%");
                column.For(x => x.UnitPrice).HeaderText("Unit Price").Width("20%");
                column.For(x => x.UnitsInStock).HeaderText("Units In Stock").Width("20%");
            })
            .Features(features =>
            {
                features.Sorting().Type(OpType.Remote);
                features.Paging().Type(OpType.Remote);
                features.Filtering().Type(OpType.Remote);
                features.Responsive().ColumnSettings(cs =>
                {
                    cs.ColumnSetting().ColumnKey("CategoryName").Classes("ui-hidden-phone");
                    cs.ColumnSetting().ColumnKey("UnitPrice").Classes("ui-hidden-phone ui-hidden-tablet");
                });
            })
            .DataSourceUrl(Url.Action("GetProducts"))
            .Render()
        )
    </body>
    </html>

http://www.igniteui.com/grid/_ga=1.235256967.729368916.1477415519

TechQA.

MVC Creating Infragistics grid in strongly-typed View

There are 1 answers

Related Questions in C#

Related Questions in ASP.NET-MVC

Related Questions in ENTITY-FRAMEWORK

Related Questions in INFRAGISTICS

Related Questions in STRONGLY-TYPED-VIEW

Popular Questions

Popular Tags

Trending Questions