Not the best title, because I don't know what title to give a good title for this issue.
Basically, I am trying to build a Grid with the ASP.NET MVC wrapper for a MVC model I created. All is fine. In fact, I am pleasantly surprised that Kendo is able to display data properly when I set `<DisplayFormat(DataFormatString:="{0:N0}")>` to one of the fields in my model. (It gives commas every 3 digits from the least significant digits i.e. 12345 => 12,345 etc). However, when I added the annotation `NullDisplayText:="0"`, the grid still leaves the cell blank instead of displaying "0" on the cell where the value is NULL.
So my question is that, why the behaviour is as such? I thought Kendo called `@Html.DisplayFor(Function(s) s.Property)` somewhere in the background but apparently this is not the case (since the annotation for `NullDisplayText` is not acknowledged).
Also, naturally, the next question is, how do I get the behaviour I am expecting? I would guess you would suggest me to use Client Template as suggested in this post, but I am hoping that I have done something wrong somewhere and that it can be placed all in one location just like the `DataFormatString` annotation.
I'm trying to add in custom conditions in the ClientTemplate using the guide here http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/faq
I have a checkbox in the child grid which i want to show a cross or a tick depending on the state.
columns.Bound(o => o.IsChecked).ClientTemplate(
"# if (IsChecked == true) { #" +
"<
i
class
=
'tickButton'
></
i
>" +
"# } else { #" +
"<
i
class
=
'crossButton'
></
i
>" +
"# } #"
);
However, doing this, i get the error message "Uncaught ReferenceError: IsChecked is not defined"
What is the correct way to get this columns bound value?
I am defining the following Kendo DropDownlist in asp.net mvc:
@(Html.Kendo().DropDownList()
.Name("OrganizationName")
.DataTextField("OrganizationName")
.DataValueField("OrganizationName")
.OptionLabel("-- Select an Organization --")
.HtmlAttributes(new { style = "width: 100%;" })
.DataSource(source =>
{
source.Custom()
.ServerFiltering(false)
.Type("aspnetmvc-ajax")
.Transport(transport =>
{
transport.Read(read =>
{
read.Url(@Url.HttpRouteUrl("DefaultAPI", new { controller = "OrganizationAPI", action = "GetAllOrganizations" })).Type(HttpVerbs.Get);
});
})
.Schema(schema =>
{
schema.Data("Data")
.Total("Total");
});
}))
And I am trying to reload the dropdownlist using javascript, as follows:
function RebindOrganizations() {
$('#OrganizationName').data("kendoDropDownList").dataSource.read();
}
The DropDownList is loading initially, but it throws an "undefined" in the javascript, specifically at the .data("kendoDropDownList") portion of the code. The error is:
TypeError: $(...).data(...) is undefined
Now I think it's probable that the issue arises because I'm trying to make the call upon returning from a modal window. Here is the code that actually calls my function:
function bindForm(dialog) {
$('form', dialog).submit(function () {
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
if (result.success) {
$('#myModal').modal('hide');
if (result.url != null)
$('#replacetarget').load(result.url); // Load data from the server and place the returned HTML into the matched element
else {
RebindOrganizations();
}
} else {
$('#myModalContent').html(result);
bindForm(dialog);
}
}
});
return false;
});
}
But when I click an input button with onClick="RebindOrganizations();" it works.
Anyone able to tell me what I'm doing wrong?
Thanks!
Laurie
Hi
what is the best method for laying out controls in a table fashion.
As an example within a PanelBar I am layout toolboxes and buttons etc. Is there a table method or please advise best mothod?
Thank you
Hi
I am trying to put together a master/detail grid where both the master and detail grid has foreign key columns. The two grids work normally with the foreign key columns when they are on their own, but once I put them together, I have an "invalid template" error.
Here's my razor view of the master/detail grid.
@(Html.Kendo().Grid<EMD.DAL.Domain.Attribute.AssetSubType>()
.Name("subTypeGrid")
.Columns(columns =>
{
columns.Bound(c => c.AssetSubTypeID).Width(50);
columns.ForeignKey(c => c.AssetTypeID, (System.Collections.IEnumerable)ViewData["assetTypes"], "AssetTypeID", "Type").Width(200);
columns.Bound(c => c.SubType).Width(300);
columns.Bound(c => c.Description).Width(300);
columns.Bound(c => c.ProductTypeID).Width(100).Hidden();
columns.Bound(c => c.PhysicalItem).Width(100).Hidden();
columns.Bound(c => c.LastModified).Hidden();
columns.Bound(c => c.LastModifiedBy).Hidden();
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
})
.ToolBar(toolbar =>
{
toolbar.Create();
})
.ColumnMenu()
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Reorderable(reorder => reorder.Columns(true))
.Navigatable()
.Selectable()
.Groupable()
.Resizable(resize => resize.Columns(true))
.Sortable(sortable =>
{
sortable.SortMode(GridSortMode.MultipleColumn);
})
.Filterable(filterable => filterable.Mode(GridFilterMode.Menu))
.Scrollable()
.ClientDetailTemplateId("template")
.HtmlAttributes(new { style = "height:800px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(15)
.Events(events => events.Error("grid_error")) // Handle the "error" event
.Model(model => model.Id(p => p.AssetSubTypeID))
.Read(read => read.Action("AssetSubTypes_Read", "AssetAttribute"))
.Create(create => create.Action("AssetSubTypes_Create", "AssetAttribute"))
.Update(update => update.Action("AssetSubTypes_Update", "AssetAttribute"))
.Destroy(destroy => destroy.Action("AssetSubTypes_Destroy", "AssetAttribute"))
)
//.Events(events => events.DataBound("dataBound"))
)
</div>
<script id="template" type="text/kendo-tmpl">
@(Html.Kendo().Grid<EMD.DAL.Domain.Attribute.SubTypeAttribute>()
.Name("attributeGrid_#=AssetSubTypeID#")
.Columns(columns =>
{
columns.Bound(c => c.SubTypeAttributeID).Hidden();
columns.Bound(c => c.AssetSubTypeID).Hidden();
columns.Bound(c => c.AttributeValueID);
//columns.ForeignKey(c => c.AttributeValueID, (System.Collections.IEnumerable)ViewData["attributes"], "AttributeValueID", "Attribute").Title("Attribute").Width(200);
columns.Bound(c => c.DefaultValue);
columns.Bound(c => c.Description);
columns.Bound(c => c.LastModified).Hidden();
columns.Bound(c => c.LastModifiedBy).Hidden();
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Model(model => model.Id(p => p.SubTypeAttributeID))
.Read(read => read.Action("SubTypeAttributes_Read", "AssetAttribute", new { assetSubTypeID = "#=AssetSubTypeID#" }))
.Update(update => update.Action("SubTypeAttributes_Update", "AssetAttribute"))
.Create(update => update.Action("SubTypeAttributes_Create", "AssetAttribute").Data("onAddSubItem"))
.Destroy(update => update.Action("SubTypeAttributes_Destroy", "AssetAttribute"))
)
.ToolBar(toolbar =>
{
toolbar.Create().HtmlAttributes((new { onclick = "setMasterSubTypeID(this, #=AssetSubTypeID#)" }));
//toolbar.Excel();
})
.Editable()
.ColumnMenu()
.Sortable()
.Scrollable()
.Resizable(resize => resize.Columns(true))
.Filterable(filterable => filterable.Mode(GridFilterMode.Menu))
.Editable(editable => editable.Mode(GridEditMode.InLine))
.ToClientTemplate()
)
</script>
Funny thing is if I comment out the foreignkeycolumn on the detail grid (columns.ForeignKey(c => c.AttributeValueID,
(System.Collections.IEnumerable)ViewData["attributes"],
"AttributeValueID", "Attribute").Title("Attribute").Width(200);), and change it to bound. Everything works.
After searching various forums and making sure there is no spacing in field names and "encoder Type" is not defined in Web.config (http://www.telerik.com/forums/master-details-grid-not-working). I cannot get the grid to work.
I may be missing something very trivial but I just can't figure out why the grids work on their own but not when they are together.
Appreciate any thoughts.
I have a situation where Kendo works and renders correctly on my local VS dev environment, but when deployed to IIS I have two issues that I think are related.
1) Kendo controls are not rendering properly as if the css files are not fully recognized. For example, color BlueOpal is applied to the button, but the border is not the same.
2) Kendo control values are not reconized on IIS. So for the following code:
@(Html.Kendo().Button()
.Name("showButton")
.HtmlAttributes(new { type = "submit", name = "ButtonType", value = "Show" })
.Content("Apply Selected Template"))
So 'ButtonType' value of 'Show' works (in the controller) on local dev, but not when rendered by IIS.
Kendo UI MVC version: 2015.1.318
I verified that all the script, content, css, etc. files are fully copied and identical on IIS as they are in my dev environment.
I need to be able to enter multiple values or ranges into a textbox, similar to MS Words print page function.
So, I could have something like 1-3, 7-10, 15,16. And I need to allow only numeric or commas.
Can that be done using the NumericTextBox?
If not, any ideas how I could accomplish this?
TIA,
Bob
I have a simple grid that uses a custom popup editor template. In the template, I'd like to use a Numeric Textbox.
Due to localization, the application keeps trying to use a comma to separate decimals in the numeric values. When these values are passed to the ASP.NET MVC back-end, the value is lost and null is passed. How can I ensure the posted value has a period separator?
I have tried setting the underlying field values to 2.5 instead of 2,5 in the grid's Save event, as well as tried to overwrite the e.model.WeightKg to 2.5. The value is still passed with a comma separator, as shown by inspecting the form data in the request.
My grid:
01.
@(Html.Kendo().Grid<PackageViewModel>()
02.
.Name(
"PackageGrid"
)
03.
.Columns(columns => {
04.
columns.Bound(o => o.PackageCode);
05.
columns.Bound(o => o.WeightKg);
06.
columns.Command(o => o.Edit());
07.
})
08.
.DataSource(d => d
09.
.WebApi()
10.
.Model(m => m.Id(o => o.PackageCode))
11.
.Read(c => c.Url(Url.HttpRouteUrl(
"DefaultApi"
,
new
{ controller =
"Packages"
})))
12.
.Create(c => c.Url(Url.HttpRouteUrl(
"DefaultApi"
,
new
{ controller =
"Packages"
})))
13.
.Destroy(c => c.Url(Url.HttpRouteUrl(
"DefaultApi"
,
new
{ controller =
"Packages"
id =
"{0}"
})))
14.
.Update(c => c.Url(Url.HttpRouteUrl(
"DefaultApi"
,
new
{ controller =
"Packages"
id =
"{0}"
})))
15.
.PageSize(20)
16.
)
17.
.Editable(e => e.Mode(GridEditMode.PopUp).TemplateName(
"Package"
))
18.
.Selectable()
19.
.Deferred()
20.
)
The numeric textbox in the template:
1.
@Html.Kendo().NumericTextBoxFor(m => m.WeightKg).Decimals(8)
And the unparsed form data, followed by the parsed form data:
sort=&group=&filter=&PackageCode=DOOS-B&WeightKg=2%2C5
sort:
group:
filter:
PackageCode:DOOS-B
LeegGewichtKg:2,5