I want to store a grid data to a table in database.
Grid which i use is Kendo Grid
//View
#(Html.Kendo().Grid<OnlineAB.Models.Sales>()
.Name("SalesGrid")
.Columns(columns =>
{
columns.Bound(p => p.Resource).Width(150);
columns.Bound(p => p.Customer).Width(150);
columns.Bound(p => p.GS).Width(150);
columns.Bound(p => p.Price).Width(150);
})
.Sortable()
)
Can anyone help me in how to store these column values to a database. When we click an "Save" button. This action is to be performed.
And also i want to add "DropDown Box" in the Column Customer. That dropdown will hold a set of data.
Go with the kendo official site's demo. I can help you if you leave the server side wrapper & wish to use httm 5. I did this sort of things recently.
Related
I have a MVC Kendo grid where one column is a client template that actually uses multiple fields. By default the built in filtering is only applied to the field the column is bound to. How do I override that so it considers both fields. Ie, when I search for "Contains" "De" a column that displays "Detroit, MI" should return.
Here's what I have so far:
MVC View
#(Html.Kendo().Grid<ViewModel>()
.DataSource(dataSource => dataSource
.Custom()
.Transport(t =>
{
t.Read(r => r.Action("StatusGridRead", "DeviceStatus"));
})
.Schema(schema => schema
.Data("Result.Data")
.Total("Result.Total")
.Errors("Result.Errors")
.Model(m =>
{
m.Id(f => f.Id);
m.Field(f => f.StateOrProvince);
m.Field(f => f.City);
...
})
)
)
.Columns(columns =>
{
columns.Bound(c => c.StateOrProvince).Title("City & State").ClientTemplate("#=City#, #=StateOrProvince#");
...
})
.Events(e=>
{
e.Filter("statusGridFilter");
})
.Sortable()
.Filterable(f =>
{
f.Extra(false);
f.Operators(o => o.ForString(s =>
{
s.Clear();
s.Contains("Contains");
s.IsEqualTo("Is Equal To");
s.StartsWith("Starts With");
s.EndsWith("Ends With");
s.DoesNotContain("Does Not Contain");
s.IsNotEqualTo("Is Not Equal To");
}));
})
)
Javascript
function statusGridFilter(e) {
if (e.field == "StateOrProvince") {
//What do I do here?
}
}
I understand if I made a column for city and one for state that would resolve this issue, however I actually have a similar scenario (client template with many string fields displayed) where that won't work and am just picking this as the easiest example. Other than making 1 column for 1 field, I'm open to any other ideas that may solve filtering for this scenario.
I have a Kendo grid that displays many columns. I have a column for SSN. When user clicks on the filter and types in 123-45-6789 it filters the correct SSN, however, when user types in 123456789 nothing is filtered. Is there any way that it can filter only 9 numbers with or without dashes.
columns.Bound(p => p.SSN)
.Title("SSN")
.Width(100);
.HtmlAttributes(new {style = "height: 579px; width: 110%"})
.Scrollable()
.Sortable()
.Filterable(filterable => filterable
.Extra(false)
.Operators(operators => operators
.ForString(str => str.Clear()
.Contains("Contains")
.IsEqualTo("Is equal to")
.StartsWith("Starts with")
.IsNotEqualTo("Is not equal to")
)
)
)
You can set the filter to use a kendoMaskedTextBox like this:
<script>
function ssnFilter(element) {
element.kendoMaskedTextBox({
mask: "000-00-0000"
});
};
</script>
#(Html.Kendo().Grid<YourModel>()
.Name("YourGridName")
.Columns(columns =>
{
columns.Bound(p => p.SSN).Filterable(f => f.UI("ssnFilter"));
}
)
Kendo MaskedTextBox documentation
Kendo Grid Filter Customization documentation
I have a kendo MVC grid that has a bound column like below
columns.Bound(c => c.CreatedDate).Format("{0:M/d/yyyy h:mm tt}").Title("Submitted on").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains"))).Format("{0: MM/dd/yyyy HH.mm.ss}");
the column formats fine when first loading the view:
06/22/2017 15.02.00
but i have some buttons which use AJAX to post back and get back filtered data and when re-populating the grid the column looks like this:
/Date(1498161720000)/
Any help?
First off, you have two seperate .Format tags with different formats specified, which is probably causing some problems. Pick which one you want to use and try just removing the other.
If that doesn't solve the problem, I would try declaring the format using data annotations. In your model, try adding this line above the declaration of CreatedDate:
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:M/d/yyyy h:mm tt}")]
and then remove .Format from your column binding.
i.e. change
columns.Bound(c => c.CreatedDate).Format("{0:M/d/yyyy h:mm tt}").Title("Submitted on").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
to
columns.Bound(c => c.CreatedDate).Title("Submitted on").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
and make sure you include the
using System.ComponentModel.DataAnnotations;
line at the top of your model if you don't already have it.
I have created a kendo grid using Asp.Net MVC wrappers. I have included a checkbox for selecting multiple rows made the wiring and everything works ok. However, I have issues, when I change page, or do a filtering as the selecting rows/checkbox disappear.
What is the solution for this problem?
You need to use .PersistSelection(true) to ensure rows remain selected when changing pages:
#(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("rowSelection")
.Columns(columns => {
columns.Bound(o => o.ShipCountry).Width(300);
columns.Bound(p => p.Freight).Width(300);
columns.Bound(p => p.OrderDate).Format("{0:dd/MM/yyyy}");
})
.Pageable(pageable => pageable.ButtonCount(5))
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Multiple))
.PersistSelection(true)
.Navigatable()
.DataSource(dataSource => dataSource
.Ajax()
.Model(m=>m.Id("OrderID"))
.PageSize(6)
.Read(read => read.Action("Orders_Read", "Grid"))
)
Also ensure you have an id column declared in the DataSource, like .Model(m=>m.Id("OrderID")) in the example, otherwise it will fail.
Full details here.
I had issues with the jQuery grid.select() however:
var grid = $('#rowSelection').data('kendoGrid');
var rows = grid.select();
This only seemed to return rows selected on the currently displayed page rather than all the rows selected across all the pages.
Is there any way to show pageSummary of all data even if there is pagination?
[
'attribute' => 'sale_total',
'pageSummary' => true,
'hAlign' => 'right',
'format' => ['decimal',2],
],
This shows only sum per page but I wanted it of all the data, not a particular page.
By Clicking the All(Show all data) link(On the right side toolbar options), the sum of all the records total will be displayed.
Try:
'summary' => {totalCount},
I'm not sure if this is what you are looking for.