Can't send data to View

[valeriybvParticipant]

Hi! I faced with some problems when try to transmitt data to View.

1. I have read the documentation here (just for example)
https://www.jqwidgets.com/asp.net-core-mvc-tag-helpers-documentation/documentation/jqxgrid/asp-net-core-tag-helper-grid-getting-started.htm?search=
then I tried to implement this in my code
So I done all steps in documentation and run my application
2. When my ActionResult in controller returns empty View – “return View()”, then I see empty datagrid on the page

3. When I try to define a List of objects in Controller’s action and transmite it to View, then I see empty page, just layout

What is the problem?

I try to do smth like this
public class ProjectController : Controller
…
public async Task<ActionResult> Index()
{
var projects = await projectService.GetProjects();
return View(projects);
…
…
and view looks like in documentation:
…some scripts…
@using RMS.Models
@model IEnumerable<Project>
<jqx-grid theme=”@ViewData[“Theme”]’ sortable=”true” filterable=”true” auto-height=”true” width=”850″ source=”Model”>
<jqx-grid-columns>
<jqx-grid-column datafield=”Id” width=”150″></jqx-grid-column>
<jqx-grid-column datafield=”Title” width=”200″></jqx-grid-column>
<jqx-grid-column datafield=”Description” width=”150″></jqx-grid-column>
</jqx-grid-columns>
<jqx-grid-column-groups>
</jqx-grid-column-groups>
</jqx-grid>

Once I thought that I made smth wrong in my code, but then I tried to write a View by myself, using just RazorPage, and my data transmitted to View as I wanted.

So there are no possibiliy to transmitt data to view like all normal persons do? Like View (ViewModel)?

[HristoParticipant]

Hello valeriybv,

I would like to ask you is the data that you write there have the same datafields names as in the “jqx-grid-columns”?
Is there any error message?
Also, I would like to suggest you try to with a synchronized operation.

Or you could try another approach. After the loading of the data to update the jqxGrid – for example, you could try with “updatebounddata“ method.

<script src="~/jqwidgets/jqxbuttons.js"></script>
<script src="~/jqwidgets/jqxscrollbar.js"></script>
<script src="~/jqwidgets/jqxgrid.js"></script>
<script src="~/jqwidgets/jqxgrid.edit.js"></script>
<script src="~/jqwidgets/jqxgrid.columnsresize.js"></script>
<script src="~/jqwidgets/jqxgrid.filter.js"></script>
<script src="~/jqwidgets/jqxgrid.selection.js"></script>
<script src="~/jqwidgets/jqxgrid.sort.js"></script>
<script src="~/jqwidgets/jqxgrid.pager.js"></script>
<script src="~/jqwidgets/jqxgrid.aggregates.js"></script>
<script src="~/jqwidgets/jqxgrid.grouping.js"></script>
<script src="~/jqwidgets/jqxdata.export.js"></script>
<script src="~/jqwidgets/jqxgrid.export.js"></script>
<script src="~/jqwidgets/jqxmenu.js"></script>
<script src="~/jqwidgets/jqxlistbox.js"></script>
<script src="~/jqwidgets/jqxdropdownlist.js"></script>
@model IEnumerable<jQWidgets.AspNet.Core.Models.SalesEmployee>
@using jQWidgets.AspNetCore.Mvc.TagHelpers;
 
@{
    ViewData["Title"] = "ASP .NET MVC Grid Aggregates Example";
}
 
@{
    var employee = Model.FirstOrDefault();
}
 
<jqx-grid id="grid" alt-rows="true" show-status-bar="true" show-aggregates="true" filterable="true" pageable="true" auto-height="true" source-id="ID" sortable="true" width="850" source="Model" instance="getInstance()">
    <jqx-grid-columns>
        <jqx-grid-column aggregates='['count']' datafield-for="@(employee.FirstName)" width="150" text="First Name"></jqx-grid-column>
        <jqx-grid-column aggregates='['count']' datafield-for="@(employee.LastName)" width="150" text="Last Name"></jqx-grid-column>
        <jqx-grid-column aggregates='['count']' datafield-for="@(employee.ProductName)" width="200" text="Product Name"></jqx-grid-column>
        <jqx-grid-column aggregates='['sum']' datafield-for="@(employee.Price)" width="100" text="Price" cells-format="c2" cells-align="HorizontalAlignment.Right"></jqx-grid-column>
        <jqx-grid-column aggregates='['sum']' datafield-for="@(employee.Quantity)" width="100" text="Quantity" cells-align="HorizontalAlignment.Right"></jqx-grid-column>
        <jqx-grid-column aggregates='['sum']' datafield-for="@(employee.Total)" width="150" text="Total" cells-format="c2" cells-align="HorizontalAlignment.Right"></jqx-grid-column>
 </jqx-grid-columns>
</jqx-grid>
							
@section scripts {								
<script type="text/javascript">									
	function getInstance(instance) {									
		instance["updatebounddata"]();									
	}									
</script>									
}

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[valeriybvParticipant]

Hi, Hristo!
Yes, my model exacly fit datafields in grid-column, but nevertheless data is not transmitted
I tried to use synchron methods, but this didn’t helped
Then I tried to useupdatebounddata, and again nothing.

And I dont get any errors. So I cant understand what heppened. I can transmitt data in simple razor page, but cant use the same method here – all I see is just blanc layout page without any grid

It is very strange. May be I did smth wrong, but I cant see it

[HristoParticipant]

Hello valeriybv,

You mean that there is no any grid visualized.
Do not have any errors?
Could you check is there the “jqx.base.css” file included?

You maybe follow this tutorial but I would like to mention again.

If this helps and you still do not have any records but the jqxGrid is visualized then you could try this:

function getInstance(instance) {
	instance["addrow"](null, { FirstName: 'Peter', Quantity: 18 });
	instance["addrow"](null, { FirstName: 'Nancy', Quantity: 24 });
};

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[valeriybvParticipant]

It is not helped

The problem is that when I call an empty view in controller, like “return View()” than I see an empty grid as should be (because model is empty)
when I declared a static list of objects directly in view, then it is worked.
But I dont want to declare a static objects. I want to write some methods in my controller with business-logic, then transmite a result data set into view.
In ASP.NET for this purpose View called with a parameter
“return View(projects)”; where “projects” – some list of objects or variable or smth else.

Seems, that this is not supported here

[valeriybvParticipant]

Lets made some clarification. I tried different steps without any result, so could you please answer to some question:
1. How exactly should I transmite data to view? (in documentation there are some parts of code with “@model = …”) How this model is being initialized?
2. Can I use approach similar to one in ASP.NET Razor Pages?
– define a DataSet in actionresult method (it could be a collection of objects, single object or smth else, static, or created from database)
– call a view with this dataset as a param (View(DataSet))
– define a model inside this view and bind it to dataset
3. Can I do it without using a web-api and without creation some json objects?
4.Could you provide a work example how could I do it?

[HristoParticipant]

Hello valeriybv,

Could you provide us with a small project with dummy records?
Afterward, I will try to provide you with a solution.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[valeriybvParticipant]

Hi!
There ara an archive with very simple project
Method Project/Index calls View with dataset of project.
Also I tried some different approaches here, trying to use dataadapter, but it is so boring.
For example, in Kendo UI I could simply map the model, like in Razor Pages

[HristoParticipant]

Hello valeriybv,

In the download package, you could find all of our demos that are in the site.
For example in the demos folder in the ASP.NET Tag Helpers subfolder (version 6.1.0) you could find the TagHelpers demos.

I would like to suggest you contact the support@jqwidgets.com and there you could attach your (simplified) project with dummy records.
Thank you for the understanding.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts