I am currently having a problem in my kendo grids. I have multiple columns who are type of decimal. The problem is when I want to use numerictextBox for those columns, I should create n editor template for n columns because of the .Name("") attribute of the numericTextBox.
Is there any way to bind the numericTextBox by using only one generic template ? Or how can I avoid creating multiple editorTemplate file in which only the name attribute is varying ?
Thanks for your help.
Here is my grid:
<% Html.Kendo().Grid<myModel>()
.Name("grid")
.Events(events =>
{
events.Save("onSaveObject");
})
.Columns(columns =>
{
columns.Bound(r => r.NAME).Title("Name");
columns.Bound(r => r.SIZE).Title("SIZE").EditorTemplateName("SIZEEditor");
columns.Bound(r => r.SIZE1).Title("SIZE1").EditorTemplateName("SIZE1Editor");
columns.Bound(r => r.SIZE2).Title("SIZE1").EditorTemplateName("SIZE2Editor");
columns.Bound(r => r.SIZE3).Title("SIZE1").EditorTemplateName("SIZE3Editor");
columns.Bound(r => r.SIZE4).Title("SIZE1").EditorTemplateName("SIZE4Editor");
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
})
..
%>
SIZEEditor.ascx
<%: Html.Kendo().NumericTextBox<decimal>()
.Name("SIZE")
.HtmlAttributes(new { value = "#=SIZE #" })
.Format("{0:n1}")
.Culture("fr-FR")
.Min(0)
.Max(500)
.Decimals(1)
%>
SIZE1Editor.ascx
<%: Html.Kendo().NumericTextBox<decimal>()
.Name("SIZE1")
.HtmlAttributes(new { value = "#=SIZE1 #" })
.Format("{0:n1}")
.Culture("fr-FR")
.Min(0)
.Max(500)
.Decimals(1)
%>
SIZE2Editor.ascx
<%: Html.Kendo().NumericTextBox<decimal>()
.Name("SIZE2")
.HtmlAttributes(new { value = "#=SIZE2 #" })
.Format("{0:n1}")
.Culture("fr-FR")
.Min(0)
.Max(500)
.Decimals(1)
%>
Thanks for your help
Your editor template specify its name, so it will render static name for input element instead of dynamic name.
change your editor template like this
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<decimal?>" %>
<%: Html.Kendo().NumericTextBoxFor(m => m)
.Format("{0:n1}")
.Culture("fr-FR")
.Min(0)
.Max(500)
.Decimals(1)
%>
Thanks Dio Dirza for your help. This did the trick. I only changed the "Inherits" value of the template.
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<decimal?>" %>
<%: Html.Kendo().NumericTextBoxFor(m=>m)
.Format("{0:n2}")
.Culture("fr-FR")
.Min(-50)
.Max(100000)
.Decimals(2)
%>
Related
I'm using checkbox in Telerik Grid.
following is my code
#(Html.Telerik().Grid<ProductModel>(Model.Products.Data)
.Name("products-grid")
.Columns(columns =>
{
columns.Bound(x => x.Id)
.ClientTemplate("<input type='checkbox' name='checkedRecords' value='<#= Id #>' />")
.Title("")
.Width(36)
.HtmlAttributes(new { style = "text-align:center" });
columns.Bound(x => x.Id);
columns.Bound(x => x.Name);
columns.Bound(x => x.Published)
.Width(100)
.Template(x => x.Published.ToString().ToLower())
.Centered();
})
.Pageable(settings => settings.Total(Model.Products.Total).PageSize(gridPageSize).Position(GridPagerPosition.Both))
.DataBinding(dataBinding => dataBinding.Ajax().Select("ProductReport", "Product"))
.ClientEvents(events => events.OnDataBinding("onDataBinding"))
.EnableCustomBinding(true)
)
I just see Id's in the checkbox column instead of checkboxes. Can anyone tell me what is wrong with my code ??
i checked this question and a few other but they dint answer my problem..
The problem is with your code definition, you just defined template in ajax call mode (with clientTemplate method):
.ClientTemplate("<input type='checkbox' name='checkedRecords' value='<#= Id #>' />")
But you should define the server-side template too, this template is used at your first and direct request:
.Template(#<text><input type='checkbox' name='checkedRecords' value='#Item.Id' /></text>)
Invalid expression term ')' is shown in kendoUI for ASPX ASP MVC4
code:
<%: Html.Kendo().Grid(gridobj)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.TMovie_id).Groupable(false).Title("ID");
columns.Bound(p => p.Name).Title("Name");
columns.Bound(p => p.Genre).Title("Genre");
columns.Command(command => command.Custom("Edit").Click("Editfunction"));
columns.Command(command => command.Custom("Delete").Click("Deletefunction"));
columns.Template(c => { %> <%= Html.ActionLink("Edit", "EditMovie","Movies") %> <% });
})
.Groupable()
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("", ""))
)
%>
Compilation Error:
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.
Compiler Error Message: CS1525: Invalid expression term ')'
Source Error:
Line 118: columns.Command(command => command.Custom("Edit").Click("Editfunction"));
Line 119: columns.Command(command => command.Custom("Delete").Click("Deletefunction"));
Line 120: columns.Template(c => { %> <%= Html.ActionLink("Edit", "EditMovie","Movies") %> <% });
Line 121:
Line 122: })
I had the same error.
If you remove ":" from <%: Html.Kendo().Grid , your problem will be solved.
i guess you have an additional ) in your code
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("", ""))
-----------------------------------------^
)
on a side note i think there is no need to close the %> before using the helper this should work
<%: Html.Kendo().Grid(gridobj)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.TMovie_id).Groupable(false).Title("ID");
columns.Bound(p => p.Name).Title("Name");
columns.Bound(p => p.Genre).Title("Genre");
columns.Command(command => command.Custom("Edit").Click("Editfunction"));
columns.Command(command => command.Custom("Delete").Click("Deletefunction"));
columns.Template(c => { Html.ActionLink("Edit", "EditMovie","Movies") });
})
.Groupable()
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("", "")
)
%>
I am using a KENDO UI grid in MVC.NET.
The grid is configured to show a column filter for each column.
Some of my columns are not filterable, though, so I want to hide the filter.
Is there a way to configure this from the C# side? (Not using CSS or JS).
In your code, you probably have something like:
<asp:Content ContentPlaceHolderID="MainContent" runat="server">
<%: Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.ProductID).Groupable(false);
columns.Bound(p => p.ProductName);
columns.Bound(p => p.UnitPrice);
columns.Bound(p => p.UnitsInStock);
})
.Groupable()
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Products_Read", "Grid"))
)
%>
</asp:Content>
If you want ProductID column not being filterable, you should say:
<asp:Content ContentPlaceHolderID="MainContent" runat="server">
<%: Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.ProductID).Groupable(false).Filterable(false);
columns.Bound(p => p.ProductName);
columns.Bound(p => p.UnitPrice);
columns.Bound(p => p.UnitsInStock);
})
.Groupable()
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Products_Read", "Grid"))
)
%>
</asp:Content>
If you are not setting up the columns, you could hide the filter buttons after the grid is initialized, such as in the databound event. Here's one way, hiding the filter button on a specific field:
$("#MyGrid").find(".k-header[data-field='Pct_positive']").find(".k-grid-filter").css("visibility","hidden");
To hide them all...
$("#MyGrid").find(".k-header").find(".k-grid-filter").css("visibility","hidden");
As far as I can tell, you would have to be able to set the columns.filterable configuration property to 'false' for those columns that you don't want filtered, as it defaults to 'true' (see Docs: columns.filterable)
Whether you can do this from the C# side will depend on how the Kendo Grid is being initialised in your code.
I didn't mention it in the question, but I was using the AutoGenerate() feature of the grid, so then there is no easy access to the Filterable setting.
One workaround for that case is:
var gb = Html.Kendo().Grid(data).Name("test");
gb.Columns(columns => { columns.AutoGenerate(true); });
// !!! Hide filter for first column in grid.
gb.Columns( (columns) => { (columns.Container.Columns[0] as IGridBoundColumn).Filterable=false; });
gb.Filterable(filtering => filtering.Enabled(true));
gb.DataSource(ds => ds
.Ajax()
.ServerOperation(true)
.Model(model => model.Id("A"))
);
gb.Render();
for the client side (jquery) kendo grid you can put filterable: false, for the individual column after putting filterable: true, for the whole grid.
eg.
field: "Margin01",
width: 40,
filterable: false,
title: "0-"
I have a telerik grid, I want to display data as below
ProductName Count
Letters 5
Phone
Pens 3
I want to do something like if count>0 then only show th evalue for count column, i.e. do not display value 0.
<% Html.Telerik().Grid(Model.Orders)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(o => o.ProductName);
if(Count>0)
{
columns.Bound(o => o.Count);
}
})
.Groupable(settings => settings.Groups(groups => groups.Add(o => o.KeyID)).Visible(false))
.Scrollable(s => s.Enabled(true))
.Scrollable(scrolling => scrolling.Height(300))
.Reorderable(reorder => reorder.Columns(true))
.Footer(true)
.Render();
%>
Thanks
You can use CellAction to render conditional results.
<%
Html.Telerik().Grid(Model.Orders)
.Name("Grid")
.CellAction(cell =>
{
if (cell.Column.Title.Equals("Count"))
{
if (cell.DataItem.Count == 0)
{
cell.Text = " ";
}
}
})
.Columns(columns =>
{
columns.Bound(o => o.ProductName);
columns.Bound(o => o.Count);
})
.Groupable(settings => settings.Groups(groups => groups.Add(o => o.KeyID)).Visible(false))
.Scrollable(s => s.Enabled(true))
.Scrollable(scrolling => scrolling.Height(300))
.Reorderable(reorder => reorder.Columns(true))
.Footer(true)
%>
I have a very similar problem to the post located here:
Telerik grid with checkbox - Checkbox not showing up when the grid initially paints
Basically, I have a telerik MVC3 razor grid with a ClientTemplate column that consists of a checkbox. When the page loads initially, the checkbox is not there - instead it is what I want the value of the checkbox to be. However, when ajax is fired (such as grouping columns together), the checkbox shows with no problem.
I don't really understand the solution to the thread I pasted above....so maybe that is the answer and I just don't know how to call the grid's constructor. Here's the code I have:
research.cshtml
#(Html.Telerik().Grid(Model)
.Name("Grid")
.DataKeys(keys => keys.Add(m => m.MessageInformation.MessageGUID))
.DataBinding(databinding => databinding.Ajax()
.Select("_ViewMessages", "Results")
.Update("_UpdateSelectedMessage", "Results"))
.Columns(columns =>
{
columns.Bound(o => o.MessageInformation.MessageGUID)
.ClientTemplate("<input type='checkbox' id='chkMessage' name='checkedRecords' value='<#= MessageInformation.MessageGUID #>' />")
.Title("Check")
.Width(50)
.HtmlAttributes(new { style = "text-align:center" });
columns.Bound(o => o.MessageInformation.MessageGUID).Title("ID");
columns.Bound(o => o.MessageInformation.MessageReceivedDateTime).Title("Received Date").Format("{0:d}");
columns.Bound(o => o.MessageInformation.MessageReceivedDateTime).Title("Received Time").Format("{0:t}");
columns.Bound(o => o.MessageInformation.MedVAMessageTypeString).Title("Message Type");
columns.Bound(o => o.MessageStatus).Title("Status");
columns.Command(commands => commands.Edit().ButtonType(GridButtonType.Text)).Title("Edit");
})
.Editable(editing => editing.Mode(GridEditMode.PopUp))
.Scrollable(scrolling => scrolling.Enabled(true))
.Sortable(sorting => sorting.Enabled(true))
.Pageable(paging => paging.Enabled(true))
.Filterable(filtering => filtering.Enabled(true))
.Groupable(grouping => grouping.Enabled(true))
.Footer(true)
)
ResultsController.cs
[GridAction]
public ActionResult Research()
{
ViewBag.Message = "Research";
return View(DataAccess.Get_Messages());
}
[GridAction]
public ActionResult _ViewMessages()
{
ViewBag.Message = "Research";
return View(new GridModel(DataAccess.Get_Messages()));
}
You are initially binding to server data so you will need a server template as well as a client template:
#(Html.Telerik().Grid(Model)
.Name("Grid")
.DataKeys(keys => keys.Add(m => m.MessageInformation.MessageGUID))
.DataBinding(databinding => databinding.Ajax()
.Select("_ViewMessages", "Results")
.Update("_UpdateSelectedMessage", "Results"))
.Columns(columns =>
{
columns.Bound(o => o.MessageInformation.MessageGUID)
.Template(mi => {
%>
<input type='checkbox' id='chkMessage' name='checkedRecords' value='<%= mi.MessageGUID %>' />
%>
})
.ClientTemplate("<input type='checkbox' id='chkMessage' name='checkedRecords' value='<#= MessageInformation.MessageGUID #>' />")
.Title("Check")
.Width(50)
.HtmlAttributes(new { style = "text-align:center" });
columns.Bound(o => o.MessageInformation.MessageGUID).Title("ID");
columns.Bound(o => o.MessageInformation.MessageReceivedDateTime).Title("Received Date").Format("{0:d}");
columns.Bound(o => o.MessageInformation.MessageReceivedDateTime).Title("Received Time").Format("{0:t}");
columns.Bound(o => o.MessageInformation.MedVAMessageTypeString).Title("Message Type");
columns.Bound(o => o.MessageStatus).Title("Status");
columns.Command(commands => commands.Edit().ButtonType(GridButtonType.Text)).Title("Edit");
})
.Editable(editing => editing.Mode(GridEditMode.PopUp))
.Scrollable(scrolling => scrolling.Enabled(true))
.Sortable(sorting => sorting.Enabled(true))
.Pageable(paging => paging.Enabled(true))
.Filterable(filtering => filtering.Enabled(true))
.Groupable(grouping => grouping.Enabled(true))
.Footer(true)
)
Another snippet for Razor syntax: CheckBox can editable after click edit.
.Template(
#<text>
<input name="chkStatus" type="checkbox" #if(item.Status) { #:checked="checked" } disabled />
</text>
)
.ClientTemplate("<input type='checkbox' name='chkStatus' value='<#= Status #>' <#=Status?'checked':''#> disabled />");
#McGarnagle's syntax doesn't work for me. Here's mine that works:
.Template(#<text><input name="chkStatus" type="checkbox" #(item.Status ? "checked=\"checked\"" : "") disabled /></text>)
.ClientTemplate("<input type='checkbox' name='chkStatus' value='<#= Status #>' <#=Status?'checked':''#> disabled />")