or
0 answers
116 views
Are there any examples out there of using Kendo and MVC extensions together on the same page or even within the same project?
carlg
Top achievements
Rank 1
Rank 1
asked
on
07 Sep 2012
3 answers
143 views
Hi,
I am trying to include inside one panel of the panel bar a template that is formed out of a couple linear gauges and some icons. The template works very well individually and also the panel bar works good by it's one.
Though, when I want to put the linear gauges inside the panel bar, and add a link to kendo.dataviz.min.js it displays everything fine, the linear gauge have their correct animations, but the panel bar expending and collapsing of an item stops working. It is just an instant transition between panels.
Is this a known issue, and if yes, how can I fix it?
Thank you and have a nice day,
I am trying to include inside one panel of the panel bar a template that is formed out of a couple linear gauges and some icons. The template works very well individually and also the panel bar works good by it's one.
Though, when I want to put the linear gauges inside the panel bar, and add a link to kendo.dataviz.min.js it displays everything fine, the linear gauge have their correct animations, but the panel bar expending and collapsing of an item stops working. It is just an instant transition between panels.
Is this a known issue, and if yes, how can I fix it?
Thank you and have a nice day,
2 answers
185 views
This might be an odd question, but I am using the datasource object to get data from the server for my grid, but there is additional information I want to display elsewhere. Right now I get the list of results, the total count, and a count of customers contacted. I want to display this number in a span for the user to work with, but I don't know where this information is stored or even if it is stored when the datasource completed event is fired. Any help would be appreciated
William
Top achievements
Rank 1
Rank 1
answered
on
07 Sep 2012
0 answers
135 views
Is there a way to have the grid show or display a message saying there are no results vs crashing the page? I don't think its uncommon to do a search and not return any records, unless I overlooked something. I'm using fluent syntax. Thanks
1 answer
102 views
My grid loads all the data without any errors and it's configured to be a popup edit window. When clicking edit, nothing happens to the grid and I don't get a popup window. Instead I receive the following error:
Uncaught TypeError: Cannot read property 'type' of undefined
I'm not really sure where to start on this since my error isn't so helpful. Any ideas? I also don't want to throw a bunch of useless information up here so let me know what details are needed from my script to get started.
Uncaught TypeError: Cannot read property 'type' of undefined
I'm not really sure where to start on this since my error isn't so helpful. Any ideas? I also don't want to throw a bunch of useless information up here so let me know what details are needed from my script to get started.
2 answers
173 views
A lot of people in my company hate the "click to activate edit mode". For the boolean editor, you have to click to edit it and then click again to switch it.
Replacing the rendering with just a checkbox has weird results. So I've tried to come up with a custom editor:
Is this the right way to do it and maintain that changes get fired on the datasource change event? Am I messing up data binding?
Is there any more information about custom editors except for the one example here? (http://docs.kendoui.com/api/web/grid) It's very terse info!
That api page mentions these items, but there is no example use that gives any indication what kind of options are "additional options" ??
Replacing the rendering with just a checkbox has weird results. So I've tried to come up with a custom editor:
function instantBoolEditor(container, options) { // flip value options.model.set('enabled', !options.model.enabled); // replace html with the same template the column uses [...] // should I do something like trigger change? options.model.trigger("change", {container: container, model:options.model}); }Is this the right way to do it and maintain that changes get fired on the datasource change event? Am I messing up data binding?
Is there any more information about custom editors except for the one example here? (http://docs.kendoui.com/api/web/grid) It's very terse info!
That api page mentions these items, but there is no example use that gives any indication what kind of options are "additional options" ??
columns.editor.container Object
The container in which the editor must be added.
columns.editor.options Object
Additional options.
columns.editor.options.field String
The field for the editor.
columns.editor.options.model Object
3 answers
955 views
The toolbar in the details grid will not open a "popup" or "inline" when I click the create function. The "save", "cancel", "delete" all work. Am I missing something? Also, the "create" in the main grid works just fine.
var sigSource = new kendo.data.DataSource({
transport: {
read: {
url: "signatures/sigrequests_json_output",
dataType: "json"
},
create: {
url: "signatures/Create",
dataType: "json"
}
},
schema: {
data: "results",
total: "count",
model: {
id: "sigreq",
fields: {
ticket_uid: { editable: false },
name: { type: "string", validation: { required:true } },
description: { type: "string" },
assigned_to: { editable: false, defaultValue: return_user() },
current_status: { editable: true },
priority: { editable: true },
ticket_tlp: { editable: true },
ticket_type: { editable: true },
discovery: { editable: true },
rule_type: { editable: true },
rule_category: { editable: true },
parent_template: { editable: true },
reference: { editable: true },
date_created: { editable: false }
}
}
},
batch: false,
pageSize: 100,
serverPaging: true,
serverFiltering: true,
serverSorting: true
});
$("#kendosigsrequests").kendoGrid({
dataSource: sigSource,
filterable: true,
sortable: true,
scrollable: true,
reorderable: true,
columnMenu: true,
height: 600,
toolbar: [ { name: "create", text: "Create New Request" } ],
pageable: {
refresh: true,
pageSizes: [10, 20, 50, 100, 150, 200, 300]
},
detailInit: detailInit,
dataBound: function() {
this.expandRow(this.tbody.find("tr.k-master-row").first());
},
columns: [
{ field : "name", title : "Name", width : 200 },
{ field : "description", title : "Description", width : 200 },
{ field : "assigned_to", title : "Assigned To", width : 200 },
{ field : "current_status", title : "Current Status", width : 150, editor: stautsDropDownEditor },
{ field : "priority", title : "Priority", width : 90, editor: priorityDropDownEditor },
{ field : "ticket_tlp", title : "TLP", width : 90, editor: tickettlpDropDownEditor },
{ field : "ticket_type", title : "Type", width : 90, editor: tickettypeDropDownEditor},
{ field : "discovery", title : "Discovery", width : 100, editor: discoveryDropDownEditor },
{ field : "rule_type", title : "Rule Type", width : 100, editor: ruletypeDropDownEditor },
{ field : "rule_category", title : "Rule Category", width : 100 },
{ field : "parent_template", title : "Parent Template", width : 300, editor: categoryDropDownEditor },
{ field : "reference", title : "Reference" },
],
editable: "popup"
});
/////////////////////////////////////////
function detailInit(e) {
var detailRow = e.detailRow;
var commentSource = new kendo.data.DataSource({
transport: {
read: {
url: "signatures/Comments",
dataType: "json"
},
create: {
url: "signatures/NewComment",
dataType: "json"
},
update: {
url: "signatures/UpdateComment",
dataType: "json"
}
},
batch: true,
pageSize: 6,
schema: {
data: "comments",
model: {
id: "comment",
fields: {
ticket_uid: { editable: true },
user: { editable: true },
comment: { editable: true },
date_created: { editable: true }
}
}
},
filter: { field: "ticket_uid", value: e.data.ticket_uid }
});
$("<div/>").appendTo(e.detailCell).kendoGrid({
dataSource: commentSource,
toolbar: ["create"],
pageable: true,
editable: "inline",
columns: [
{ field: "date_created", title: "Date", width: 150 },
{ field: "user", title: "By", width: 100 },
{ field: "comment", title: "Comment" },
{ command: "edit" }
]
});
}
0 answers
132 views
A
1
2
3
B
1
2
3
I have tree view which has editable functionality. When user edits the node and click on save, it should save the newly edited nodes in an array. I gone through some examples given and tried observablearray, assigning new data to the datasource but it is not recorded. Please help!. Thank you.
1
2
3
B
1
2
3
I have tree view which has editable functionality. When user edits the node and click on save, it should save the newly edited nodes in an array. I gone through some examples given and tried observablearray, assigning new data to the datasource but it is not recorded. Please help!. Thank you.
1 answer
112 views
I am using the Kendo UI web version Trial.
I am using jQuery 1.8.2 and I am unable to create the dateTimePicker in my asp.net mvc website.
I receive a Javascript error stating that the "Object does not support this Property or Method".
I think this might be due to referencing it incorrrectly.
I have looked at the source of the rendred page and it looks ok.
I am not sure what all I should include for it? Please let me know.
Thanks
I am using jQuery 1.8.2 and I am unable to create the dateTimePicker in my asp.net mvc website.
I receive a Javascript error stating that the "Object does not support this Property or Method".
I think this might be due to referencing it incorrrectly.
I have looked at the source of the rendred page and it looks ok.
I am not sure what all I should include for it? Please let me know.
Thanks
Nohinn
Top achievements
Rank 1
Rank 1
answered
on
07 Sep 2012
0 answers
508 views
I'm trying to get the DatePicker inside my grid's custom popup editor to init/show the Date from my DataSource ...
Here's a fiddle to show you what I mean: http://jsfiddle.net/kzpzC/4/
<div id="grid" class="k-content clearfix"></div>
<script id="templ" type="text/x-kendo-template">
<div data-container-for="expires_at" class="k-edit-field">
<input type="date" name="expires_at" data-bind="value:expires_at" data-role="datepicker"/>
</div>
</script>
$('#grid').kendoGrid({
dataSource: {
data: [
{
name: 'test 1',
expires_at: "2010-11-01T00:00:00Z"},
{
name: 'test 2',
expires_at: "2012-04-25T00:00:00Z"}
],
pageSize: 10
},
columns: [
{
field: "name",
title: "Name",
template: '<strong>#=name#</strong>'},
{
field: "expires_at",
title: "Date",
template: '#= kendo.toString(new Date(expires_at), "MM/dd/yyyy") #',
width: "100px"},
{
command: ["edit"],
title: " ",
width: "210px"}
],
editable: {
mode: "popup",
template: kendo.template($('#templ').html(), {
useWithBlock: false
}),
update: true,
destroy: false
}
});​
Maybe someone can point me in the right direction ...!?
thanks
Here's a fiddle to show you what I mean: http://jsfiddle.net/kzpzC/4/
<div id="grid" class="k-content clearfix"></div>
<script id="templ" type="text/x-kendo-template">
<div data-container-for="expires_at" class="k-edit-field">
<input type="date" name="expires_at" data-bind="value:expires_at" data-role="datepicker"/>
</div>
</script>
$('#grid').kendoGrid({
dataSource: {
data: [
{
name: 'test 1',
expires_at: "2010-11-01T00:00:00Z"},
{
name: 'test 2',
expires_at: "2012-04-25T00:00:00Z"}
],
pageSize: 10
},
columns: [
{
field: "name",
title: "Name",
template: '<strong>#=name#</strong>'},
{
field: "expires_at",
title: "Date",
template: '#= kendo.toString(new Date(expires_at), "MM/dd/yyyy") #',
width: "100px"},
{
command: ["edit"],
title: " ",
width: "210px"}
],
editable: {
mode: "popup",
template: kendo.template($('#templ').html(), {
useWithBlock: false
}),
update: true,
destroy: false
}
});​
Maybe someone can point me in the right direction ...!?
thanks
