Hi,
How can I disable error to get to the global error handlar, when we define a local error handle for Kendo grid? I've tried to use e.preventDefault(), but it doesn't work.
Global error handling
$(document).ajaxError(
function
(e, request) {
setError(request);
});
Example of local error handling
<script>
function onError(e, args) {
//TODO: Stop error from being propagated to global .ajaxError
HandleError(e);
}
</script>
@(Html.Kendo().Grid<Premise>()
.Name(
"grdName"
)
<-- SNIP -->
.DataSource(ds => ds
.Ajax()
<-- SNIP -->
.Events(e => e.Error("onError")
)
)Any ideas on how to solve it?
I was exporting to Excel just fine in Chrome when I started using this product. Now I get an "Aw, Snap" error anytime I do it. Firefox works just fine. I cleared cache/cookies, disabled virus scanner, rebooted machine, even reinstalled Chrome.
Here is the grid code:
this.Html.Kendo().Grid<EmployeeHistoryGridVM>()
.Name("grid")
.Filterable()
.ColumnMenu(x => x.Filterable(true))
.Sortable()
.Groupable()
.ToolBar(toolbar =>
{
toolbar.Excel();
//toolbar.Custom().Name("foo").Text("Perform Action").Action("PerformAction", "EmployeeHistory");
//toolbar.Template(x => { this.Html.Write("test"); });
})
.Scrollable(scrollable => scrollable.Height(430))
.Columns(col =>
{
col.Bound(x => x.Id).Width(120).Sortable(false).Locked();
col.Bound(x => x.CategoryName).Width(120).Sortable(true);
col.Bound(x => x.CompanyName).Width(120).Sortable(true).Filterable(true);
col.Group(g =>
g.Title("Month 12th Count")
.HeaderHtmlAttributes(new { style = "text-align: center;"})
.Columns(c =>
{
c.Bound(x => x.Month1_12Count).Title("Month 1").Filterable(true).HeaderHtmlAttributes(new { style = "white-space: normal"}).Width(120);
c.Bound(x => x.Month2_12Count).Title("Month 2").Filterable(true).HeaderHtmlAttributes(new { style = "white-space: normal" }).Width(120);
c.Bound(x => x.Month3_12Count).Title("Month 3").Filterable(true).HeaderHtmlAttributes(new { style = "white-space: normal" }).Width(120);
}));
col.Bound(x => x.Month1).Filterable(true).Width(120);
col.Bound(x => x.Month2).Filterable(true).Width(120);
col.Bound(x => x.Month3).Filterable(true).Width(120);
col.Bound(x => x.PayCycleCode).Sortable(true).Filterable(true).Width(120);
col.Bound(x => x.Quarter).Sortable(true).Filterable(true).Width(120);
col.Bound(x => x.TaxCode).Sortable(true).Filterable(true).Width(120);
col.Bound(x => x.Year).Sortable(true).Filterable(true).Width(120);
})
.Excel(excel => excel
.FileName("test.xlsx")
.Filterable(true)
.AllPages(true)
//.ForceProxy(true)
.ProxyURL(Url.Action("Export_Save", "EmployeeHistory")))
.Filterable()
.Resizable(x => x.Columns(true))
.Reorderable(x => x.Columns(true))
//.Events(e => { e.ColumnMenuInit("filterMenuInit"); })
.Pageable(pageable => pageable
.ButtonCount(5)
.Info(true))
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(50)
.Read(read => read.Action("GetData", "EmployeeHistory").Data("sendAntiForgery")))
.ToHtmlString();
And here is the Controller code:
[HttpPost]
public ActionResult Export_Save(string contentType, string base64, string fileName)
{
var fileContents = Convert.FromBase64String(base64);
return File(fileContents, contentType, fileName);
}
public ActionResult GetData([DataSourceRequest]DataSourceRequest request)
{
//request.Deflatten(EmployeeHistoryGridVM.KendoDBMapping);
IQueryable<ViewCompanyStatus> details = this.DataManager.AppDataContextManager.GetViewCompanyStatusRepository()
.Find(x => x.Id != 0) as IQueryable<ViewCompanyStatus>;
Func<ViewCompanyStatus, HistoryCompanyStatsGridVM> InfoFactory = delegate(ViewCompanyStatus model)
{
return new HistoryCompanyStatsGridVM
(
model
);
};
DataSourceResult result = details.ToDataSourceResult(request, x => InfoFactory(x));
// large data sets will blow us the F up for export
//JsonResult r = Json(result, JsonRequestBehavior.AllowGet);
var serializer = new JavaScriptSerializer { MaxJsonLength = Int32.MaxValue };
var result2 = new ContentResult
{
Content = serializer.Serialize(result),
ContentType = "application/json"
};
return result2;
}
Thanks in advance!
I am using Telerik Grid / Popup editing. When the user clicks the Add New Record/Edit button, he/she needs to see a form with several fields that are not from the grid. How can that be done?
In other words, the form needs to be customized.
For Example:
My grid contains the following columns:
1) name
2) phone
3) fax
But the popup should contain:
1) email
2) address
3) state.
I am using Telerik MVC with razor and C#.
Hi guys,
I have a pie chart that I'm fetching json data from my controller to populate. The json is pretty basic:
[
{
type:
"AddOutageRequest"
,
count: 155
},
{
type:
"AuthorizationRequest"
,
count: 362
},
{
type:
"CurrentOutageRequest"
,
count: 2118
},
{
type:
"PlannedOutageRequest"
,
count: 97
},
{
type:
"RegionRequest"
,
count: 1212
}
]
This is good and I fetch it with my controller method but the labels on the pie chart/legend/etc. are (of course) the same as the "type" field. I want to present it in a more friendly manner so for example show "PlannedOutageRequest" as "Planned Outages" on the chart.
How would I do this in my chart wrapper (as I can't change the backend) or would I have do some javascript after the chart loads?
Here's my chart markup if that helps:
<div class=
"chart-wrapper"
>
@(Html.Kendo().Chart()
.Name(
"serverRequestsByTypeChart"
)
.Legend(legend => legend.Position(ChartLegendPosition.Bottom))
.Series(series =>
{
series
.Pie(
"count"
,
"type"
)
.Labels(labels => labels
.Template(
"#= category #: \n #= value#"
)
.Background(
"transparent"
)
.Visible(
true
)
); ;
})
.DataSource(datasource =>
{
datasource.Read(read => read.Action(
"RequestTypesByTimePeriod"
,
"Data"
));
})
)
</div>
Thanks!
@Html.Kendo().DropDownListFor(model => model.CarSelected).BindTo(Model.Cars)
@(Html.Kendo().DropDownListFor(x => x.CarModelSelected).DataTextField(
"Name"
).DataValueField(
"Id"
)
.Enable(
false
).AutoBind(
false
).OptionLabel(
"Select"
))
.CascadeFrom(
"CarSelected"
)
.DataSource(source => source.Read(read => read.Action(
"CarModels"
,
"Car"
)
.Data(
"filter"
)).ServerFiltering(
true
))
public
ActionResult Edit(
int
id)
{
var car = repository.load(id);
CarVm carVm = car.InjectFrom(car);
...
carVm.CarModelSelected = car.Model.Id;
return
View(carVm);
}
Seeing an interesting problem when combining DatePicker and Grid functionality in the inline editing.
The date is editable without clicking the edit button. Clicking the edit button returns the date field to a input box and datepicker functionality is lost and when cancelling an edit the date is lost entirely and becomes an empty field.
Downloaded some other code samples out there and seeing some of the same issues. Anyone come upon these?
Cshtml:
<
div
>
@(Html.Kendo().Grid(Model)
.Name("commissionGrid")
.Columns(columns =>
{
columns.Bound(p => p.CommissionId).Hidden();
columns.Bound(p => p.TenantId).Hidden();
columns.Bound(p => p.SimpleName);
columns.Bound(p => p.StartDate).HtmlAttributes(new
{
@class = "templateCell"
}).ClientTemplate(
Html.Kendo().DatePicker()
.Name("FDPicker_#=CommissionId#")
.Format("{0:MM/dd/yyyy}")
.HtmlAttributes(new { data_bind = "value:StartDate" })
.ToClientTemplate().ToString()
).Format("{0:MM/dd/yyyy}");
columns.Bound(p => p.CustomerName);
columns.Bound(p => p.CustomerNumber);
columns.Command(command =>
{
command.Edit();
command.Destroy();
}).Title("Commands");
})
.Events(ev => ev.DataBound("db"))
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Navigatable()
.Sortable()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(false)
.PageSize(10)
.ServerOperation(true)
.Model(model =>
{
model.Id(p => p.CommissionId);
model.Field(p => p.CommissionId).Editable(false);
})
.Update(update => update.Action("EditingInline_Update", "Commissions"))
.Destroy(destroy => destroy.Action("EditingInLine_Destroy", "Commissions"))
)
)
</
div
>
JavaScript
function
db(e) {
var
grid =
this
;
$(
".templateCell"
).each(
function
() {
eval($(
this
).children(
"script"
).last().html());
var
tr = $(
this
).closest(
'tr'
);
var
item = grid.dataItem(tr);
kendo.bind($(
this
), item);
});
}
My Goal:
On Edit - display display text associated with DropDownList ID selected in lookup table.
Problem:
When creating a record, the DropDownList will lookup the value and display the associated text. Because the field is used to store only the "index" or ID of the associated record, when editing, only the integer index is displayed. I would like the text to be displayed as if it was just selected when the edit window is opened.
I have just begun working with Kendo and just not sure of the syntax.
Thank you!
Hi
I am trialling your product with a view to purchasing soon, but am having some issues with the default rendering of connections. I am using Layout Type and Down SubType. I've attached two files. One is the vertical layout that I am trying to achieve, but as you can see the connections don't look great. The second is a horizontal layout which seems to render much better, but isn't what I want.
Is there anything I can do to correct this. I tried adding new connectors to the shape, but can't work out what should go in the Position property in MVC.
Thanks
Jared
Hi,
I have a treeview template for rendering kendo drop down next to kendo treeviewItem. Below is the code. But I am getting javascript error from Kendo.all.min.js file saying "Invalid template". If I use Html.Dropdownlistfor instead kendo it works but with kendo drop down I am getting an error. Can you please help on this?
<script id="treeview-template" type="text/kendo-ui-template">
#: item.text #
# if (item.text=="Allow Subclient") { #
@*@(Html.DropDownListFor(m => Model.FieldConfigurationModel.ReocrdValue, selList, new { Style = "width: 200px;"}))*@
@(Html.Kendo().DropDownListFor(x => x.FieldConfigurationModel.ReocrdValue)
.BindTo(new SelectList(Model.FieldConfigurationModel.SelectDataSource.Select(p => new SelectListItem() { Value = p.id, Text = p.value }), "Value", "Text", selectedId))
.AutoBind(true)
.Name("RecordValue")
.DataTextField("Text")
.DataValueField("Value")
.HtmlAttributes(new { Style = "width: 100px !important;"})
.Value(selectedId))
# } #
</script>
Below is the javascript error i get
Uncaught Error: Invalid template:'
#: item.text #
# if (item.text=="Allow Subclient") { #
<input Style="width: 100px !important;" id="RecordValue" name="RecordValue" type="text" value="abc12" /><script>
jQuery(function(){jQuery("#RecordValue").kendoDropDownList({"dataSource":[{"Text":"abc12","Value":"969a5ff4-e0fc-426d-be02-a48b0104e342"},{"Text":"ABC2","Value":"4ff38eb7-813a-493f-b25c-a48b01049ee4"}],"dataTextField":"Text","autoBind":true,"dataValueField":"Value"});});
' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='\n '+$kendoHtmlEncode( item.text )+'\n '; if (item.text=="Allow Subclient") { ;$kendoOutput+='\n \n <input Style="width: 100px !important;" id="RecordValue" name="RecordValue" type="text" value="abc12" /><script>\n\tjQuery(function(){jQuery("';RecordValue").kendoDropDownList({"dataSource":[{"Text":"abc12","Value":"969a5ff4-e0fc-426d-be02-a48b0104e342"},{"Text":"ABC2","Value":"4ff38eb7-813a-493f-b25c-a48b01049ee4"}],"dataTextField":"Text","autoBind":true,"dataValueField":"Value"});});
;$kendoOutput+=;}return $kendoOutput;'