Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Lai
60
How to show data with Grid
posted

Hi ~ I am new here.

I got the trouble that I don't know what happened is it. 

When I set "@Layout = null " in the View file (GetMemberDetail.cshtml). The Grid can be worked.

But, when I set  @{Layout = "~/Views/Shared/_Layout.cshtml"; }. The Gird doesn't work.

The ScreenShot :   https://imgur.com/a/84SEu

Below is my code.

_ViewStart.cshtml

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

----------------------------------------------------------------------------------------------

_Layout.cshtml

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - 我的 ASP.NET 應用程式</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")

</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                @Html.ActionLink("TestProject", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li>@Html.ActionLink("首頁", "Index", "Home")</li>
                    <li>@Html.ActionLink("關於", "About", "Home")</li>
                    <li>@Html.ActionLink("連絡方式", "Contact", "Home")</li>
                </ul>
                @Html.Partial("_LoginPartial")
            </div>
        </div>
    </div>
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year - 我的 ASP.NET 應用程式</p>
        </footer>
    </div>
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)
</body>
</html>

----------------------------------------------------------------------------------------------

View : GetMemberDetail.cshtml

@using TestProject.Models;
@using Infragistics.Web.Mvc;
@model System.Linq.IQueryable<TestProject.Models.MemberDetailModel>

@{
    ViewBag.Title = "GetMemberDetail";
    Layout = null;
}

<h2>GetMemberDetail</h2>

<!-- Ignite UI Required Combined CSS Files -->
<link href="http://cdn-na.infragistics.com/igniteui/2017.1/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
<link href="http://cdn-na.infragistics.com/igniteui/2017.1/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/2017.1/latest/js/infragistics.core.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.lob.js"></script>

<script src="http://cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.loader.js"></script>

<h4>grid start</h4>
@(Html.Infragistics()
    .Grid(Model).ID("grid_member")
    .AutoGenerateColumns(false)
    .PrimaryKey("ID")

    .Columns(column =>
    {
        column.For(x => x.ID).DataType("string").HeaderText("ID");
        column.For(x => x.Birthday).DataType("string").HeaderText("Birthday");
        column.For(x => x.BeginDate).DataType("string").HeaderText("BeginDate");
        column.For(x => x.EndDate).DataType("string").HeaderText("EndDate");
    })

    .DataBind()

    .Render())
<h4>grid end</h4>

-----------------------------------------------------------------------------------------------------

Parents
  • 7535
    Offline posted

    Hello Lai,

    Thank you for posting to our forum.

    I followed the code you provided and was unable to reproduce the behavior you're describing.
    I have created a MVC sample of iggrid and set Layout through the View page and when I am running the sample ,
    Page rendered as expected with the layout and now when I assign null to the Layout page is still rendered correctly.

    I have attached the sample project I used to test this. Please test this project on your PC; whether or not it works correctly may help indicate the nature of this problem.

    If the project does show the product feature working correctly, then more information will be needed to reproduce the issue in a sample that can be used for debugging. It will help if you can provide a small, isolated sample application that demonstrates the behavior you are seeing. This can be done by either making the sample that I provided more like your application or by isolating the behavior from your application by removing dependencies on any third parties or databases.

    Also I would like to point couple of things regarding layout page are:
    • Instead of declaring the Layout page in every view page, you can use the _ViewStart page. So the application will be less maintainable.
    • When a View Page Start is running, the “_ViewStart.cshtml” page will assign the Layout page for it.
    • Have all the infragistics references in the _LayoutPage so that you don’t need to have it on each view page.

    Find the attached sample for your reference and let me know if I can provide any further assistance.

    igGrid_SaveChangesHandlers.zip
Reply Children