Hi to all,
I followed example in dojo to do this (example in dojo.PNG) that is exactly what I need.
In my case, instead, I'm using a text/x-kendo-template, it's an only difference between my code and example's dojo.
Instead see same effect, I found that my grid is overflowed of window perimeter (examplemy grid.PNG), to see the footer of my grid I need to scroll down at the end (end of grid overflowed.PNG)
This is my style script
style>
#itemLedgerEntriesWindow {
padding: 0;
}
#ileGrid {
border-width: 0;
height: 100%; /* DO NOT USE !important for setting the Grid height! */
}
#ileTemplate {
border-width: 0;
height: 100%; /* DO NOT USE !important for setting the Grid height! */
}
This is my code
<!--Template della window relativa ai dettagli-->
<
input
type
=
"hidden"
id
=
"purchaseKey"
name
=
"purchaseKey"
value
=
"false"
/>
<
script
type
=
"text/x-kendo-template"
id
=
"ileTemplate"
>
<
input
type
=
"hidden"
id
=
"itemNoKey"
name
=
"itemNoKey"
value
=
"#= No #"
/>
@(Html.Kendo().Grid<
ItemLedgerEntryModel
>()
.Name("ileGrid")
.Filterable()
.AutoBind(true)
.Columns(columns =>
{
columns.Bound(f => f.DocumentNo);
columns.Bound(f => f.OrderNo);
columns.Bound(f => f.VendorNo);
columns.Bound(f => f.PostingDate).Format("{0:dd/MM/yyyy}");
columns.Bound(f => f.EntryType);
columns.Bound(f => f.UnitOfMeasureCode);
columns.Bound(f => f.Quantity).Format("{0:N2}").HtmlAttributes(new { style = "text-align: right;" });
})
.Sortable() // Enable sorting
.Pageable()
//.Scrollable(scrollable => scrollable.Virtual(true))
.DataSource(dataSource => dataSource //Configure the Grid data source.
.Ajax() //Specify that Ajax binding is used.
.PageSize(25)
.ServerOperation(true)
.Read(read => read.Action("LedgerEntries", "ItemLedgerEntry").Data("itemNoData"))
).ToClientTemplate()
)
</
script
>
<!--Window dei dettagli dell'articolo-->
@(Html.Kendo().Window()
.Name("itemLedgerEntriesWindow")
.Title("Movimenti Magazzino")
//.LoadContentFrom("GetItemLedgerEntries", "Home")
.Visible(false)
//.Iframe(true)
.Height(600)
.Width(1100)
//.Resizable()
//.Draggable()
.Modal(true)
//.Events(e=>e.Activate("onActivateIleWindow"))
)
<!-- << DETTAGLIO MOVIMENTI ARTICOLO-->
How can I do this?
Hi,
we try to use the Grid in Razor Pages (not MVC).
So we have only the page and the page model, not view, controller and model.
All works fine, but how to enable AJAX editing with popup form?
To define the update, create, read and destroy actions via HTML Helper, we need a Controller for the CrudOperationsBuilder. But we dont have one.
Do you have an example, how we can achieve this with Razor Pages?
Thanks in Advance
Ralf
Hi,
Just putting this here in case anybody else might like to use the new Razor Pages:
Here is how I bound to a PageModel (ie no Action or Controller)
So the PageModel simply has a public property
public
List<MyOjectToBindTo> {
get
;
set
;}
@(Html.Kendo().DropDownList()
.Name("size")
.BindTo(new List<MyOjectToBindTo>(Model.MyOjectToBindTo))
.DataValueField("Id")
.DataTextField("Name")
.HtmlAttributes(new { style = "width: 100%" })
)
I am using Grid and via BindTo(...) it displays a list of objects from my PageModel; this works fine.
@(Html.Kendo().Grid<ProjectImportFormat>()
.Name(
"grdProjectImports"
)
.BindTo(Model.ProjectResults)
.AutoBind(
true
)
...
)
What I like to do is display the count of all records in the footer of the grid. Normally aggregates are declared inside the datasource, but there is only a list, no datasource. How can this be accomplished?
Regards
Heiko
This is likely a Word Processing library question as well as an Editor question.
I want to have a tree/view/list. For each node in the tree, I want to create a separate Editor document for the user. Then, depending on the node selection, I want to output the Editor document for the selected node and its child nodes out to one PDF document. I will need to insert numbering, use styles and formatting in order to indicate the level of the Editor output Do you have an example that would allow me to stitch together the Editor information from multiple nodes and output it this way?
Thanks,
Joel
I'm using the Bootstrap 4 theme and have a page which uses several Grids.
Is there a simple css wrapper class I can use for one of the Grids on the page (I don't want to alter css that will affect all grids) to make it smaller and more compact than the others?
For example, if it were pure bootstrap, I would simply add the following classes to the table element:
<table class="table table-sm">
Hello, I'm currently devloping a .NETCore application. The application is divided into three layers: Data Layer(with models definition), Service Layer (to retrieve data and return it as IQueryable objects) and the Application Layer (where Telerik is installed).
My controller read action in the ApplicationLayer is as follows:
public IActionResult ReadAziende([FromServices] IAziendaService service, [DataSourceRequest] DataSourceRequest request)
{
var aziende = service.ListWithIncludes().ToDataSourceResult(request, m => _mapper.Map<IndiceAziendaVM>(m));
return Json(aziende);
}
The Service Layer action ListWithIncludes is as follows:
public IQueryable<AziendaFullIncludeDTO> ListWithIncludes()
{
return _context.Aziende
.Include(a => a.Settore)
.Include(a => a.Indirizzi)
.Include(a => a.Tags)
.ThenInclude(a => a.Tag)
.Include(a => a.CodiceAteco)
.Include(a => a.TenantDataAccess)
.ThenInclude(a => a.Tenant)
.AsNoTracking()
.Select(a => _mapper.Map<AziendaFullIncludeDTO>(a)) ;
}
The Service Layer is correctly returning the DTO with included fields in an IQueryable Object but as soon as I pass it to ToDataSourceResult all included fields get lost.
What is the correct way to apply ToDataSourceResult to an IQueryable Object with Included navigation properties?
Thanks.
I saw demo about custom command, where it shows details into a Telerik Windows (modal).
We suppose thatwe have product list, and we want obtain ledger entries relative.
I met a problem to pass the Product ID to grid that I want to use for filter ledger entries.
I try to insert a TAG Helper into kendo template
<
script
type
=
"text/x-kendo-template"
id
=
"template"
>
<
div
id
=
"details-container"
>
<div>
<
h2
>#= description #</
h2
>
<
em
>#= ID #</
em
>
</div>
@(Html.Kendo().Grid<ItemLedgerEntryModel>()
.Name("ileGrid")
.Filterable()
.AutoBind(true)
.Columns(columns =>
{
columns.Bound(f => f.DocumentNo);
columns.Bound(f => f.OrderNo);
columns.Bound(f => f.VendorNo);
columns.Bound(f => f.PostingDate).Format("{0:dd/MM/yyyy}");
columns.Bound(f => f.EntryType);
columns.Bound(f => f.UnitOfMeasureCode);
columns.Bound(f => f.Quantity).Format("{0:N2}").HtmlAttributes(new { style = "text-align: right;" });
})
.Sortable() // Enable sorting
.Pageable()
.Scrollable(scrollable => scrollable.Virtual(true))
.DataSource(dataSource => dataSource //Configure the Grid data source.
.Ajax() //Specify that Ajax binding is used.
.Read(read => read.Action("LedgerEntries", "ItemLedgerEntry").Data(new {itemNo: #= ID #})) //How can I do this????
)
)
</
div
>
</
script
>
but it not "receives" Produc ID.
Where I wrong?
I would like to enable or disable the custom command based on the current line value.
My model, called ItemModel has a property called HasPicture, custom command called "GetPictureCommand" should be disabled when HasPicture returns false.
@(Html.Kendo().Grid<
ItemModel
>
()
.Name("itemGrid")
//.ToolBar(t => t.Search())
.Filterable()
.AutoBind(true)
.Columns(columns =>
{
columns.Bound(f => f.No);
columns.Bound(f => f.Description);
columns.Bound(f => f.Brand);
columns.Command(c => c.Custom("GetPictureCommand").Text(" ").IconClass("k-icon k-i-image").Click("getImage")).Width(52);
columns.Bound(f => f.PurchasesQty).Format("{0:N2}").HtmlAttributes(new { style = "text-align: right;" });
columns.Command(command => command.Custom("ItemLedgerEntryPurchaseCommand").Text(" ").IconClass("k-icon k-i-arrow-drill").Click("showPurchaseDetails")).Width(52);
columns.Bound(f => f.NetChange).Format("{0:N2}").HtmlAttributes(new { style = "text-align: right;" });
columns.Command(command => command.Custom("ItemLedgerEntryCommand").Text(" ").IconClass("k-icon k-i-arrow-drill").Click("showDetails")).Width(52);
columns.Bound(f => f.LastEntryDate).Format("{0:dd/MM/yyyy}");
})
.Pageable() // Enable paging
.Sortable() // Enable sorting
.Scrollable(scrollable => scrollable.Virtual(true))
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource => dataSource //Configure the Grid data source.
.Ajax() //Specify that Ajax binding is used.
.PageSize(10)
.Read(read => read.Action("Item_ReadData", "Home").Data("additionalData"))
)
)
How can I do this?