1. Home
  2. Forum
  3. ASP.NET MVC
  4. Section miss into Demo layout

Section miss into Demo layout

Buongiorno, sto provando a implementare una pivot grid utilizzando la vostra demo a questo link: http://mvc.syncfusion.com/demos/web/pivotgrid/relationalwebapi .
Nella demo vengono utilizzate le sezioni "ScriptReferenceSection", "StyleSection", "ScriptSection", "ControlsSection" e "PropertiesSection".
Non trovo il layout nel quale vengono create. Dove le posso trovare? Me le potete scrivere?

3 Replies
MM Manikandan Murugesan Syncfusion Team February 21, 2018 01:00 PM UTC

Hi Simone, 

You can find the PivotGrid ‘RelationalWebAPI’ sample and ‘Layout.cshtml’ file in below installed location. 
  
Sample: $systemdrive:\ Users \<User-Name>\AppData\Local\Syncfusion\EssentialStudio\<ES-Version>\MVC\Samples\web\Views\PivotGrid\RelationalWebAPI.cshtml 
Layout: $systemdrive:\ Users \<User-Name>\AppData\Local\Syncfusion\EssentialStudio\<ES-Version>\MVC\Samples\web\Views\Shared\_Layout.cshtml  
Eg : C:\Users\manikandan.murugesan\AppData\Local\Syncfusion\EssentialStudio\16.1.0.13\MVC\Samples\web\Views\PivotGrid\RelationalWebAPI.cshtml 
C:\Users\manikandan.murugesan\AppData\Local\Syncfusion\EssentialStudio\16.1.0.13\MVC\Samples\web\Views\Shared\_Layout.cshtml 

Kindly refer the below documentation link to render PivotGrid using WebAPI Controller (Relational datasource): 
 

Please let us know if you have any other queries. 

Thanks, 
Manikandan. 


SI Simone February 21, 2018 01:31 PM UTC

Sorry, you don't undestand. I wanna see creation of section. Where i can find? The section are "ScriptReferenceSection", "StyleSection", "ScriptSection", "ControlsSection" and "PropertiesSection". Can you write to me?


MM Manikandan Murugesan Syncfusion Team February 22, 2018 01:17 PM UTC

Hi Simone, 
 
The RenderSection is used to render the contents of the named sections in the _Layout page, in your case  "ScriptReferenceSection", "StyleSection", "ScriptSection", "ControlsSection" and "PropertiesSection". Refer to the following MSDN links for more information: https://msdn.microsoft.com/en-us/library/system.web.webpages.webpagebase.rendersection(v=vs.99)  
 
Consider the following example,  
 
[_Layout.cshtml]  
<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="utf-8" />  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>@ViewBag.Title - My ASP.NET Application</title>  
    @Styles.Render("~/Content/css")  
    @Styles.Render("~/Content/ej/web/default-theme/ej.web.all.min.css")  
    @Scripts.Render("~/bundles/modernizr")  
    @Scripts.Render("~/Scripts/jquery-3.1.1.min.js")  
    @Scripts.Render("~/Scripts/jsrender.min.js")  
    @Scripts.Render("~/Scripts/ej/ej.web.all.min.js")      
    @RenderSection("StyleSection", required: false)  
</head>  
<body>  
  <h2>  @RenderSection("SampleHeading", required: false) </h2>  
   <div class="container body-content">  
         @RenderBody()     
       @RenderSection("ControlsSection", required: false)  
   </div>  
  
    @Scripts.Render("~/bundles/bootstrap")  
    @Html.EJ().ScriptManager()  
    @RenderSection("ScriptSection", required: false)  
</body>  
</html>  
 
In the above code, we have added the "StyleSection", "SampleHeading", "ControlsSection" and " ScriptSection " in the _Layout page using RenderSection method. Now, these sections can be defined in the index.cshtml page. During the page render the contents from these sections will be loaded into the respective sections in the _layout page. Refer to the following example code.  
 
[Index.cshtml]  
@section SampleHeading{ <span class="sampleName">Accordion / Default Functionalities</span>}  
  
@section ControlsSection{  
    <div class="controlframe">  
        @{Html.EJ().Accordion("basicAccordion").Items(data =>  
            {  
            data.Add().Text("Inbox").ContentTemplate(@<div>  
        <div class="emp-list">  
            <img src="../Content/Images/Employees/3.png" alt="employee" />  
            <div class="time-panel">7:30</div>  
            <b class="headername">Catriona</b><br />  
            All WinRT controls are optimized for touch, supporting common gestures: zooming, panning, selecting, double-tapping, rotating, resizing.  
        </div>  
        <div class="emp-list">  
            <img src="../Content/Images/Employees/6.png" alt="employee" />  
            <div class="time-panel">5:33</div>  
            <b class="headername">John Linden</b><br />  
            All the components in the ASP.NET MVC have been built from the ground up with performance in mind and are extremely lightweight.  
        </div>  
        <div class="emp-list">  
            <img src="../Content/Images/Employees/8.png" alt="employee" />  
            <div class="time-panel">2:10</div>  
            <b class="headername">Louis</b><br />  
            Big data is a broad term for data sets so large or complex that traditional data processing applications are inadequate. Challenges include analysis, capture, data curation, search, sharing, storage, transfer, visualization, querying and information privacy.  
        </div>  
    </div>);  
            data.Add().Text("Sent").ContentTemplate(@<div>  
        <div class="emp-list">  
            <img src="../Content/Images/Employees/8.png" alt="employee" />  
            <div class="time-panel">3:55</div>  
            <b class="headername">Louis</b><br />  
            Big data is a broad term for data sets so large or complex that traditional data processing applications are inadequate. Challenges include analysis, capture, data curation, search, sharing, storage, transfer, visualization, querying and information privacy.  
        </div>  
        <div class="emp-list">  
            <img src="../Content/Images/Employees/6.png" alt="employee" />  
            <div class="time-panel">6:47</div>  
            <b class="headername">John Linden</b><br />  
            Cloud computing, also known as 'on-demand computing', is a kind of Internet-based computing, where shared resources, data and information are provided to computers and other devices on-demand.  
        </div>  
    </div>);  
            data.Add().Text("Trash").ContentTemplate(@<div>  
        <div class="emp-list">  
            <img src="../Content/Images/Employees/3.png" alt="employee" />  
            <div class="time-panel">8:30</div>  
            <b class="headername">Catriona</b><br />  
            With our sophisticated support system, built from the ground up to support all type of customers, you will have a streamlined experience working with our support team.  
        </div>  
    </div>);  
            }).Render();}  
    </div>  
}  
  
@section StyleSection{  
    <style>  
        #basicAccordion img {  
            float: left;  
            height: 40px;  
            padding-right: 6px;  
        }  
  
        .emp-list {  
            border-bottom: 1px solid #BBBCBB;  
            margin-bottom: 9px;  
            padding-bottom: 9px;  
        }  
  
            .emp-list:last-child {  
                border-bottom: none;  
                padding-bottom: 0;  
            }  
  
        .time-panel {  
            float: right;  
            color: #2382C3;  
        }  
  
        .headername {  
            font-size: 16px;  
            font-weight: 600;  
        }  
  
    </style>  
}  
  
  
@section ScriptSection{  
    <script>  
        alert("Hello!!");  
    </script>  
}  
 
Note: the second parameter at RenderSection method is set to false to make that section option in every page. If it is set as true or not set (default value), then it will be mandatory to include that section at every content page. 
 
We have attached a sample for your reference, please find the sample at the following Link:http://www.syncfusion.com/downloads/support/forum/136011/ze/MVCsample1716896646   
 
 
Regards,  
Manikandan. 


Loader.
Up arrow icon