Grid in Nested Layouts does not render data , which scripts do I need

7 Replies
4 Participants

Created by
ME Megatron

Platform
ASP.NET MVC

Platform
ASP.NET MVC

Control
Gantt

Created On
Jan 11, 2016 12:34 AM UTC

Last Activity On
Jan 18, 2016 02:52 PM UTC

Want to subscribe?
SIGN IN

Hi, I've a ASP MVC project with _Layout page and -> nested Views, I am using 2 controls

_Layout page:

1-> GridViewpage: Grid With Master Details View

2-> GanttwithGridViewPage: Gantt with Grid. (Grid shows but Gantt does not Render, there is a frame, but data source says 0)

I am getting errors from the scripts as widgets not defined ej not defined. Or, some of the controls not showing data. I would like to configure the UI side correctly with the page structure. The installs have older versions of JS

I have the following questions:

1.    Can you tell me what all files should be included in the Head section? of the _Layout

2.    What files should be included in the child views?

3.    What Order should these files be in?

4.    What does Scriptmanager do, how are they helping me?

5.    Should I put it after every control? or only once at the end of the page?

6.    Should I include both the scripts and script manager or only one.

7.    What is the difference between ej.widgets.js and ej.web.all.js; and do we include both

8.    In the custom Js script generator, if I choose just grid script, will it include all the dependent JS files, or will I need to include the other dependent files.

9.    What does the Grid.render function do, it exists on some help pages and not the other?

10. Should I include core files, if I include all

11. Should I include core files, if I include custom files

12. What is unobtrusive used for? (I have included this as true in web config with the corresponding js file)

7 Replies

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team January 11, 2016 09:57 AM UTC

Hi Megatron,

Thanks for contacting Syncfusion Support.

Query #1, #2, #3: Can you tell me what all files should be included in the Head section? of the _Layout, What files should be included in the child views?, What Order should these files be in?

Please refer to the following code example and Help Document for control dependencies.

<head>

http://help.syncfusion.com/js/control-initialization#adding-the-required-javascript-files

Follow the above order to refer the scripts within the _Layout.cshtml and there is no need to refer each scripts file again in every view pages.

If the individual control files were included in the application, do not need to include ej.widgets.min.js or ej.web.all.min.js scripts.

If you are referring custom scripts for the MVC Grid, you have to include ej.core.min.js, ej.data.min.js, ej.grid.min.js and other sub-controls of Grid like, ej.waitingpopup.min.js, ej.pager.min.js. Refer to the Help document for custom script dependencies.

http://help.syncfusion.com/aspnetmvc/grid/grid-dependencies

Query #4, #5, #6: What does Scriptmanager do, how are they helping me? Should I put it after every control? or only once at the end of the page? Should I include both the scripts and script manager or only one.

The main reason for referring the ScriptManager in _Layout file is that, it can be referred as common by all the View files present within your application and it should be included in the _Layout.cshtml.

While rendering the Grid in partial view, unobtrusive javascript plays a vital role. The ASP.Net MVC Controls will render in two modes Unobtrusive mode and Non-unobtrusive mode. The mode of rendering can be controlled by setting the UnobtrusiveJavascriptEnabled key of the appSettings in web.config.

Unobtrusive Mode

In Unobtrusive mode, we can define the ScriptManager in the _Layout page alone and there is no need to define them in partial view.

Non-unobtrusive Mode

In Unobtrusive mode, provide the @(Html.EJ().ScriptManager()) in the partial view as well as in the _Layout page.

[Webconfig]

. . . .

</appSettings>

(Partial view)

@(Html.EJ().Grid< object >("Grid")

.Datasource((IEnumerable<object>)ViewData["datasource"])

. . .

)
@Html.EJ().ScriptManager()

Query #6, #7: What is the difference between ej.widgets.js and ej.web.all.js; and do we include both In the custom Js script generator, if I choose just grid script, will it include all the dependent JS files, or will I need to include the other dependent files.

ej.widgets.min.js will include the mobile controls along with web controls whereas ej.web.all.min.js will include only web controls of Syncfusion.

On selecting any individual controls in the Custom Script Generator, it will include other dependent script files too. So don’t need to select the dependency files explicitly.

Query #8: What does the Grid.render function do, it exists on some help pages and not the other?

Render() is renders the control. If you are rendering a Grid with regular C# code block, i.e. with @{Html.EJ()}, it must use Render(). For the Html helper (@(Html.EJ) an explicit expression, doesn’t need Render(). Refer to the following code examples.

@{Html.EJ().Grid<object>("Grid")

. . ..

.Columns(col =>

{

. . .

}).Render();
}

@(Html.EJ().Grid<object>("Grid")

. . . . . .

.Columns(col =>

{

. . . . . ..

})
)

Query #9, #10: Should I include core files, if I include all, Should I include core files, if I include custom files

If you included the ej.web.all.js in your application, there is no need of ej.core.js. But for the custom/individual scripts, ej.core.js is necessary.

Query #11: What is unobtrusive used for? (I have included this as true in web config with the corresponding js file)

To avoid some uncertainties and difficulties in a usual Javascript environment, Unobtrustive Javascript support has been introduced. It is easier for the users to create Syncfusion components with basic level HTML tag-like structure.

When the UnobtrusiveJavaScriptEnabled option is set to true in the web.config file, the control usually renders with the HTML5 data attributes and also the reference to the ej.unobtrusive.min.js file needs to be included in the application.

If you explicitly set this option to false, then the control rendering takes place through scripts, which requires the usage of script manager in your application.

Refer to the Help Document for unobtrusive support.

http://help.syncfusion.com/js/unobtrusive-support

Regards,
Seeni Sakthi Kumar S.

ME Megatron January 13, 2016 01:31 AM UTC

Hello, its working fine for Grid, but its now working for Gantt and schedule when I use other BS theme. Can you also specify what I need to add for Gantt, and why the Grid is working but not the Gantt.

thanks

MK Mahalakshmi Karthikeyan Syncfusion Team January 13, 2016 05:14 PM UTC

Hi Megatron,

We can render the Gantt Control with the same reference list and in the same order as we described in the previous update. And we were not able to reproduce any issue while rendering the Gantt with Grid control in the Bootstrap theme. Please find the sample below,

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/GanttAndGrid-1104744961

If you still face any issue then please get back to us by modifying the attached sample to reproduce it.

Regards,

Mahalakshmi K.

ME Megatron January 14, 2016 09:24 PM UTC

Thanks I am trying it out, but with any 3rd party theme BS, the schedul and gant do not show context or scroll bars. Can you tell me what should I look for to debug it

MK Mahalakshmi Karthikeyan Syncfusion Team January 15, 2016 02:31 PM UTC

Hi Megatron,

Gantt Control:

We have rendered Gantt and Grid in the boostrap container, but still we couldn’t reproduce any issue, can you please share us how you are using third party Boostrap in your project? It will be helpful for us to provide you better solution. Please find the code example for details,

<div>

@(Html.EJ().Grid<object>("LinkedGrid")

//…

)

</div>

<div>

@(Html.EJ().Gantt("Gantt").

//…

)

</div>

If you still facing any issue please get back to us by modifying this sample to reproduce the issue.

Schedule Control:

We were unable to reproduce the issue “Scrollbars are not shown” at our end and the same have prepared a sample which can be downloaded from the following location,
http://www.syncfusion.com/downloads/support/forum/121628/ze/GanttSample1712473569
If you still face any issue then please get back to us by modifying the attached sample to reproduce it.
Note: We have removed the packages in the above sample kindly restore it before running the sample.

Regards,

Mahalakshmi K.

TR Trav January 15, 2016 08:26 PM UTC

Hello, I am new to your components and I am excited to try this out.

I am also interested in this, because I am using my own BS theme. The picture in the question has helped me, but the solution does not work for me. The reply/sample given is not helpful, its a copy and paste from a very old outdated solution old libs, like EF 5 in 2016. As a developer I am working with ASP MVC 5, JSON 8, Jquery 1.11.3, EF 6.1 and EF 7 are getting ready to come out. I spent a lot of time trying to fix this solution.

From the sample ....

<?xml version="1.0" encoding="utf-8"?>

</packages>

Main issue for me, I cannot get the control to render correctly with other BS themes. With the default bootstrap 3.3.6 in house yes this works, but when I try the bigger controls like gant inside any of the other custom bootstrap themes they stops working. The point of Bootstrap was compatibility, and many css namespaces from syncfusion controls are overlapping.

BTW, in your rich text editor there is not way to reset the back ground color to transparent or white, and very hard to do ordered list alignments.

thanks

Taz

MK Mahalakshmi Karthikeyan Syncfusion Team January 18, 2016 02:52 PM UTC

Hi Taviz,

Gantt Control:

Query1: but when I try the bigger controls like gant inside any of the other custom bootstrap themes they stops working. The point of Bootstrap was compatibility, and many css namespaces from syncfusion controls are overlapping.

Solution: Still we were not able to reproduce the issue in Gantt control rendering when we run the control with other 3^rd party bootstrap theme. We have tried with some open source custom bootstrap theme and we can successfully render the Gantt and Grid in the same page. Please find the below screen shot for details.

Can you please share us more details about the custom boostrap theme you are using in your project exactly?

That will be helpful for us to provide you appropriate solution.

Rich Text Editor control:

Query:” in your rich text editor there is not way to reset the back ground color to transparent or white”
RTE has inbuilt support to Clear formats which is integrated with RTE toolbar . please find the below code snippet to include the clearformat in toolbar.
<code>
List<String> clear = new List<string>() { "clearFormat", "clearAll" };
.....
@{Html.EJ().RTE("rteSample").ShowHtmlSource(true).Width("100%").ContentTemplate(@<div>
<p><b>Description:</b></p>
……
</div>).ShowFooter(true).IsResponsive(true).MinWidth("20px").ToolsList(toolsList).Tools(tool =>tool.Clear(clear).FormatStyle(formatStyle).Tables(tables).Links(links).Images(images).Effects(effects).Casing(casing).Font(font).Styles(style).Media(media).Alignment(alignment).Lists(lists).Clipboard(clipboard).DoAction(doAction).Indenting(indenting).View(view)).Render();}
</code>
Please find the alltools sample in the following link.
http://jsplayground.syncfusion.com/Sync_pcbpuprh
Query:”And very hard to do ordered list alignments.”

We are unable to get the exact problems which you have faced on ordered list from the above shared information. Please use the above sample to reproduce your problem or share us the video or screenshots, so that it would help us to assist you further.

Regards,
Mahalakshmi K.

7 Replies
4 Participants
Want to subscribe?
SIGN IN
Created by
ME Megatron
Platform
ASP.NET MVC
Control
Gantt
Created On
Jan 11, 2016 12:34 AM UTC
Last Activity On
Jan 18, 2016 02:52 PM UTC

Viewer Component

.NET PDF Processing Library

Conversions

Editor Component

.NET Word Processing Library

Conversions

Editor Component

.NET Excel Processing Library

Conversions

.NET PowerPoint Processing Library

Conversions

Grid in Nested Layouts does not render data , which scripts do I need

Enterprise Solutions

Free Products

Viewer Component

.NET PDF Processing Library

Conversions

Editor Component

.NET Word Processing Library

Conversions

Editor Component

.NET Excel Processing Library

Conversions

.NET PowerPoint Processing Library

Conversions

Learning

Resources

Support

Grid in Nested Layouts does not render data , which scripts do I need