I want to create a bound form with next/prev/first/last/delete/new buttons.
Is there any sample code or demos out there on how to implement this? Even better would be samples that also show a linked subgrid, a la invoice details/Line Items.
Thanks,
Brad
If the grid column re-size is enabled and the user re-sizes one or more column in the grid. Is there any way to restore those column sizes automatically later? I've found several posts on the subject but none seem to work.
The last attempt was made using the "element" object to restore the grid column sizes:
$(
"#grid-id .k-grid-header-wrap"
).find(
"colgroup col"
).eq(xx).width(yy);
$(
"#grid-id .k-grid-content"
).find(
"colgroup col"
).eq(xx).width(yy);
Hello,
I have a tooltip like so:
.Tooltip(tt => tt.Visible(
true
).Template(
"#= kendo.format('{0:p}', percentage)#"
)))
This is great and gives me the percentage of the values in the charts fine...EXCEPT, I would like the percentages to have no decimal points, i.e: 23% instead of 22.80% for example.
Is there any way Telerik can do that for me?
IF NOT:
Can I at least get 22.8%
Thanks.
Here is my code:
@(Html.Kendo().Grid<TelerikMvcApp1.Models.UserViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.FirstName)
.Filterable(f => f
.Operators(operators => operators
.ForString(str => str.Clear()
.StartsWith("Starts With")
.EndsWith("Ends With")
.IsEqualTo("Is Equal To")
.IsNotEqualTo("Is Not Equal To")
)
)
)
.Title("First Name")
.Width(200);
columns.Bound(p => p.LastName)
.Filterable(f => f
.Operators(operators => operators
.ForString(str => str.Clear()
.StartsWith("Starts With")
.EndsWith("Ends With")
.IsEqualTo("Is Equal To")
.IsNotEqualTo("Is Not Equal To")
)
)
)
.Title("Last Name")
.Width(200);
columns.Bound(p => p.Email)
.Filterable(f => f
.Operators(operators => operators
.ForString(str => str.Clear()
.StartsWith("Starts With")
.EndsWith("Ends With")
.IsEqualTo("Is Equal To")
.IsNotEqualTo("Is Not Equal To")
)
)
)
.Title("Email ID")
.Width(200);
columns.Bound(p => p.Status)
.Title("Status")
.Filterable(ftb => ftb
.Cell(c => c
.ShowOperators(false)
)
)
.Width(200);
columns.Bound(p => p.LastAccess)
.Filterable(true)
.Title("Last Access")
.Format("{0:MM/dd/yyyy}")
.Width(200);
})
.AutoBind(true)
.Pageable(pageable => pageable
.PageSizes(true)
)
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Multiple)
.Type(GridSelectionType.Row)
)
.Sortable(sortable => sortable
.AllowUnsort(true)
.SortMode(GridSortMode.SingleColumn))
.Scrollable(a => a.Height(100))
.Filterable(f => f
.Mode(GridFilterMode.Row)
.Extra(false)
)
.Reorderable(reorder => reorder.Columns(true))
.Resizable(resize => resize.Columns(true))
.HtmlAttributes(new { style = "height:720px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(25)
.Read(read => read.Action("Details_Read", "Grid"))
)
)
In the blocked letter lines is the part where i cannot customize the filter. So, please anyone tell me how to create a custom filter when using .Mode(GridFilterMode.Row) and i have tried using template within the cell(in 'status' column) to create a drop down list, but it is also not working. There are no good examples on this custom filter in MVC razor syntax. In this custom filter i want to keep two options, so please anyone tell me how can i do that!
Hi,
Can we have any sample for Bar chart with Scatter Line...
I define a batch editing grid with the wrapper ASP.NET MVC, exactly like the demo : http://demos.telerik.com/aspnet-mvc/grid/editing
But the result is different. Fields that appear when editing a cell are not kendo widget.
By example, the unit price field is a simple input tag with the class "text-box". It's not a kendo widget numerictextbox.
I make a sample project with exactly the same file editing.cshtml.
I have a form of 3 grids. One is an editable (Incell) form, one is a standard grid with ajax data binding, and the last one is a grid that has a droppable area from which rows from the second grid are dropped from. After form submission, the first grid works fine, but the other two fail - the drag/drop stops working and the ajax data binding fails as well. It appears that after the form is being replaced (InsertionMode = InsertionMode.Replace), the grid is not recognized in the document.ready javascript function.
Ajax Form syntax:
@using (Ajax.BeginForm("AddCustomer","CustomerMaintenance", new AjaxOptions()
{
HttpMethod = "Post",
UpdateTargetId = "modal-content",
OnSuccess = "OnCustomerAddSuccess",
OnFailure = "OnCustomerAddFailure",
OnBegin = "return CompileStuff();",
OnComplete = "$('.modal-dialog').hideLoading();",
InsertionMode = InsertionMode.Replace
}, new {@id = "AddCustomerForm"}))
Second grid:
@(Html.Kendo().Grid<UserCustomerItem>()
.Name("userCustomerListGrid")
.Scrollable(scoll => scoll.Enabled(true))
.HtmlAttributes(new { style = "height:100%;" })
.Columns(columns =>
{
columns.Bound(uc => uc.UserId).Hidden(true);
columns.Bound(uc => uc.FullName);
})
.DataSource(ds => ds
.Ajax()
.PageSize(100)
.Read(r => r.Action("GetUserListForDataSource", "CustomerMaintenance").Data("getSelectedDataSourceId"))
)
)
Third Grid:
@(Html.Kendo().Grid(Model.ExplicitUserCustomerItemList)
.Name("selectedUserCustomerListGrid")
.Scrollable(scoll => scoll.Enabled(true))
.HtmlAttributes(new { style = "height:100%;" })
.Columns(columns =>
{
columns.Bound(uc => uc.UserId).Hidden(true).ClientTemplate("<input type='hidden' name='ExplicitUserCustomerItemList[#=getUserCustomerIndex(data)#].UserId' value='#=UserId#' />");
columns.Bound(uc => uc.FullName).ClientTemplate("<input type='hidden' name='ExplicitUserCustomerItemList[#=getUserCustomerIndex(data)#].FirstName' value='#=FirstName#' /> " +
"<input type='hidden' name='ExplicitUserCustomerItemList[#=getUserCustomerIndex(data)#].LastName' value='#=LastName#' />" +
"#=FullName#"); ;
columns.Command(command => command.Destroy()).Width(100);
})
.Events(e => e.Remove("onRemoveSelectedUserCustomer"))
.DataSource(ds => ds
.Ajax()
.Destroy("DestroyDummy", "CustomerMaintenance")
.Model(model =>
{
model.Id(p => p.UserId);
model.Field(p => p.FirstName);
model.Field(p => p.LastName);
model.Field(p => p.FullName);
})
.ServerOperation(false)
)
)
Document Ready Function:
$(document).ready(function () {
userCustomerListGrid = $("#userCustomerListGrid").data("kendoGrid");
selectedUserCustomerListGrid = $("#selectedUserCustomerListGrid").data("kendoGrid");
$('#DataSourceId').change(function () {
userCustomerListGrid.dataSource.read();
selectedUserCustomerListGrid.dataSource.data([]);
selectedUserCustomerListGrid.dataSource.read();
....
}
}
Per another forum post, I made the userCustomerListGrid and the selectedUserCustomerListGrid global vars.
After form submission (inconsistent but most of the time), those two variables are undefined.
Do you know why this would be?
Thanks in advance.
I am trying to create a grid that has 5 static parent categories that when expanded will use AJAX to show the data within those categories. Since the categories are static I just create a model, with a Name and Type property, in the controller action and bind them directly to the grid
@(Html.Kendo().Grid(Model.Categories)
.Name(
"CategoryGrid"
)
.Columns(c =>
{
c.Bound(b => b.Name);
c.Bound(b => b.Type);
})
.ClientDetailTemplateId(
"result-template"
)
)
<script id=
"result-template"
type=
"text/kendo-tmpl"
>
@(Html.Kendo().Grid<ChildClass>()
.Name(
"#=Name#_child"
)
.Columns(c =>
{
c.Bound(b => b.ID);
c.Bound(b => b.Description);
})
.DataSource(ds => ds
.Ajax()
.PageSize(20)
.Read(r => r.Action(
"ChildSearch"
,
"Search"
,
new
{ Type =
"#=Type#"
}))
)
.Pageable()
.Selectable()
.ToClientTemplateId()
)
</script>
I unfortunately can't share a screen shot as my dev box doesn't have an internet connection today, but the result is all the columns of the parent grid are offset to the left by 1.
The values for the Name column and an empty header appears in the first column.
The values for Type and the header "Name" appears in the second column.
A blank view, meaning the row styles cut off at the right end of the 2nd column, and the header "Type" appear in the third column.
So my question would be: Why is this happening?
Thanks
Hi
I just playing arround with the PivotGrid, and asking me, if it possible to change the style of the excel export. The cell are allways grey, if I change the background color in the stylesheet to red, then in the browser it changed to red, but in de excel not.
Is it possible to change that? I couldn't find out in a short time.
regards
Hi,
I've run into a bit of a snag within the onRemove javascript method. We have a custom confirm dialog in our application and I'd like to trigger that when removing files from the upload, there does not seem to be any support in the remove method for deferred objects. I'm just not sure how I can proceed. Should I try to override the click function on the remove button so it triggers a different method that then triggers the remove event of the actual upload control? Is there a way to bypass the javascript onRemove, but still process the rest of the remove logic? Is it possible to have the remove workflow delay until my deferred dialog box has completed?
Thanks,
Kevin