Telerik Forums
Kendo UI for jQuery Forum
1 answer
120 views
Hi,

I'm trying to accomplish an TreeView Context menu based on a value in the clicked row.
This is the structure of the treeview:

$("#treeview").kendoTreeView({
dataSource: [{
id: 1, text: "Folder", type: "", items: [
{ id: 2, text: "Document 1", type: true },
{ id: 3, text: "Document 2", type: true }
]
}], 
template: "<div class='#= item.type #' >#= item.text # </div><input type='hidden' class='data-id' value='#= item.id #' /><input type='hidden' class='type-id' value='#= item.type #' />"
});

I'm using the KendoUI.EX extention (https://github.com/insanio/kendoui.ex) for the contextmenu.

var cm = $('#contextMenu').kendoMenuEx({
                        dataSource: [
                            {
                                text: 'ContextMenu',
                                click: function (event) {
                                    alert("Clicked ContextMenu");
                                }
                            }
                        ],
                        anchor: '#TreeView li',
                        delay: 1500
                    });


I need to have something like this:

contextmenu 1 = "Open 1 document", "Show properties"
contextmenu 2 = "Open all documents"

onContextMenuOpen ->
if  type = "document" -> open contextmenu 1
if type = "folder" -> open contextmenu 2

I looked into the events of the treeview and context menu. And there is no event that gets fired between clicking right mouse button and showing the menu.

I hope someone can help me with this, or put me on the right track.
Thanks in advance

Stijn
Alexander Valchev
Telerik team
 answered on 13 Aug 2013
1 answer
121 views
How can i achieve something like the scrollbable images at the bottom in a ListView Control. It has two yellow arrows at the extreme. 
http://demos.kendoui.com/aeroviewr/#photos/42719114. 

any updates from anybody ? 
Alexander Valchev
Telerik team
 answered on 13 Aug 2013
1 answer
169 views
Hi,

We have upgraded our jquery to 1.9.3 to make kendo grid with draggable columns
But as we are creating project in ASP.NET MVC, It internally uses jquery.unobtrusive-ajax.js and jquery.validate.js.
These scripts are not upgraded for jquery version 1.9.3 so we are unable to create grid with draggable columns.
Can you please let me know what can i do in this situation to create grid with draggable columns?

Regards,
Jalpesh
Atanas Korchev
Telerik team
 answered on 13 Aug 2013
0 answers
110 views
figure out.
CW
Top achievements
Rank 1
 asked on 13 Aug 2013
0 answers
95 views
I am confused on how to send the save data to an outside controller. Im using kendo for html.   Here is my code for the scheduler. How could I send the data from a save to a controller. 
Thanks

$("#scheduler").kendoScheduler({
                date: new Date("2013/6/13"),
                startTime: new Date("2013/6/13 07:00 AM"),
                height: 600,
                views: [
                "day",
                    { type: "week", selected: true },
                    "month",
                    "agenda"
                ],
                timezone: "Etc/UTC",
                save: scheduler_save,
                remove: scheduler_remove,
                edit: scheduler_edit,
                cancel: scheduler_cancel,
                dataSource: {
                    batch: true,
                    transport: {
                        read: {
                            url: "/Team/Calendar/PopulateCalendar/",
                            dataType: "json",
                            
                        },
                        //update: {
                        //    url: "/Team/Calendar/UpdateAppointment/",
                        //    dataType: "json"
                        //},
                        //create: {
                        //    url: "/Team/Calendar/CreateAppointment/",
                        //    dataType: "json"
                        //},
                        //destroy: {
                        //    url: "http://demos.kendoui.com/service/tasks/destroy",
                        //    dataType: "jsonp"
                        //},
                        parameterMap: function (options, operation) {
                            if (operation !== "read" && options.models) {
                                return { models: kendo.stringify(options.models) };
                            }
                        }
                    },
                    schema: {
                        model: {
 
                            id: "taskId",
                            fields: {
                                taskId: { from: "TaskID", type: "number" },
                                title: { from: "Title", defaultValue: "No title", validation: { required: true } },
                                start: { type: "date", from: "Start" },
                                end: { type: "date", from: "End" },
                                startTimezone: { from: "StartTimezone" },
                                endTimezone: { from: "EndTimezone" },
                                description: { from: "Description" },
                                recurrenceId: { from: "RecurrenceID" },
                                recurrenceRule: { from: "RecurrenceRule" },
                                recurrenceException: { from: "RecurrenceException" },
                                ownerId: { from: "OwnerID", defaultValue: 1 },
                                isAllDay: { type: "boolean", from: "IsAllDay" }
 
                            }
                        }
                         
                    },
                     
                    resources: [
                        {
                            field: "ownerId",
                            title: "Owner",
                            dataSource: [
                                { text: "Alex", value: 1, color: "#f8a398" },
                                { text: "Bob", value: 2, color: "#51a0ed" },
                                { text: "Charlie", value: 3, color: "#56ca85" }
                            ]
                        }
                    ]
                }
            })
        });
corey
Top achievements
Rank 1
 asked on 12 Aug 2013
1 answer
416 views
Hi there!

The following code returns null in IE10 but returns values in Chrome and Firefox.
var grid = $("#saleGrid").data("kendoGrid");
row = grid.select();
item = grid.dataItem(row);

I have debugged the internal method and I have found that there is data there. But for whatever reason I am getting null values in IE.
I have attached a screencast to highlight the issue fully.

Screencast showing error
Craig
Top achievements
Rank 1
 answered on 12 Aug 2013
0 answers
110 views
Honestly i'm really confused on how this works.  I can get the scheduler to populate.  Im not sure how to make the edit and create work.. I can click on an appointment and then i just get a load screen. I know its because I don't exactly know what i am doing here.  I have to call my controller for the read update create and destroy.   Can anyone help me with the functions i would have to use.  In the demo it really does not explain how to make the update, create, and destroy work if you call an outside function. OH and im using the html version of kendo

                
dataSource: {
    batch: true,
    transport: {
        read: {
            url: "/Team/Calendar/PopulateCalendar/",
            dataType: "json",
            
        },
        update: {
            url: "/Team/Calendar/UpdateAppointment",
            dataType: "json"
        },
        create: {
            url: "/Team/Calendar/CreateAppointment",
            dataType: "jsonp"
        },
        destroy: {
            url: "http://demos.kendoui.com/service/tasks/destroy",
            dataType: "jsonp"
        },
I am honestly so confused on how to make the functions show the appointment view i understand on the save button to set the fields to the fields in my database but how can i make the appointment view show up.Sorry if this is a really dumb question im just so confused on this.

Thanks,
Corey
corey
Top achievements
Rank 1
 asked on 12 Aug 2013
2 answers
137 views
Im trying to populate the scheduler with an function in my controller. 
Here is my scheduler javascript.

  <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")"> </script>  
    <script src="@Url.Content("~/Scripts/kendo/kendo.all.min.js")"></script>
    <script>
        $(function () {
            
 
            $("#scheduler").kendoScheduler({
                date: new Date("2013/6/13"),
                startTime: new Date("2013/6/13 07:00 AM"),
                height: 600,
                views: [
                "day",
                    { type: "week", selected: true },
                    "month",
                    "agenda"
                ],
                timezone: "Etc/UTC",
                dataSource: {
                    batch: true,
                    transport: {
                        read: {
                            url: "/Team/Calendar/PopulateCalendar/",
                            dataType: "json",
                            
                        },
                        update: {
                            url: "http://demos.kendoui.com/service/tasks/update",
                            dataType: "jsonp"
                        },
                        create: {
                            url: "http://demos.kendoui.com/service/tasks/create",
                            dataType: "jsonp"
                        },
                        destroy: {
                            url: "http://demos.kendoui.com/service/tasks/destroy",
                            dataType: "jsonp"
                        },
                        parameterMap: function (options, operation) {
                            if (operation !== "read" && options.models) {
                                return { models: kendo.stringify(options.models) };
                            }
                        }
                    },
                    schema: {
                        model: {
 
                            id: "taskId",
                            fields: {
                                taskId: { from: "TaskID", type: "number" },
                                title: { from: "Title", defaultValue: "No title", validation: { required: true } },
                                start: { type: "date", from: "Start" },
                                end: { type: "date", from: "End" },
                                startTimezone: { from: "StartTimezone" },
                                endTimezone: { from: "EndTimezone" },
                                description: { from: "Description" },
                                recurrenceId: { from: "RecurrenceID" },
                                recurrenceRule: { from: "RecurrenceRule" },
                                recurrenceException: { from: "RecurrenceException" },
                                ownerId: { from: "OwnerID", defaultValue: 1 },
                                isAllDay: { type: "boolean", from: "IsAllDay" }
 
                            }
                        }
                         
                    },
                    filter: {
                        logic: "or",
                        filters: [
                            { field: "ownerId", operator: "eq", value: 1 },
                            { field: "ownerId", operator: "eq", value: 2 }
                        ]
                    }
                },
                resources: [
                    {
                        field: "ownerId",
                        title: "Owner",
                        dataSource: [
                            { text: "Alex", value: 1, color: "#f8a398" },
                            { text: "Bob", value: 2, color: "#51a0ed" },
                            { text: "Charlie", value: 3, color: "#56ca85" }
                        ]
                    }
                ]
            });
 
            $("#people :checkbox").change(function (e) {
                var checked = $.map($("#people :checked"), function (checkbox) {
                    return parseInt($(checkbox).val());
                });
 
                var filter = {
                    logic: "or",
                    filters: $.map(checked, function (value) {
                        return {
                            operator: "eq",
                            field: "ownerId",
                            value: value
                        };
                    })
                };
 
                var scheduler = $("#scheduler").data("kendoScheduler");
 
                scheduler.dataSource.filter(filter);
            });
        });
</script>
and this is the function that is being hit on the read datasource.

public ActionResult PopulateCalendar()
        {
            using (var entities = new OpenRoad.Data.Repository.OpenRoadEntities())
            {
                var appointments = (from e in entities.Appointments
                                    where e.UserId == OpenRoad.Web.Session.UserId
 
                                    select new Models.Calendar
                                    {
                                        TaskID = e.AppointmentId,
                                        UserId = e.UserId ?? '1',
                                        Title = e.Subject,
                                        Description=e.Description,
                                        Start = e.StartTimeUtc ?? DateTime.Now,
                                        End = e.EndTimeUtc ?? DateTime.Now,
                                        IsAllDay = false,
                                        RecurrenceRule= null,
                                        RecurrenceID=null,
                                        RecurrenceException=null,
                                        StartTimezone=null,
                                        EndTimezone=null,
 
                                    }).OrderBy(o => o.Start).ToList();
                 
                return Json(appointments, JsonRequestBehavior.AllowGet);
            }            
        }

Any idea on why i cant get anything to show?

Thanks in advance
corey
Top achievements
Rank 1
 answered on 12 Aug 2013
1 answer
40 views
Does the read datasource not work if a list of a model is returned?
This is the code im using to try and populate the scheduler but everything ive tried makes it return blank. Could it be because im trying to return a list of models?
public ActionResult PopulateCalendar()
        {
            using (var entities = new OpenRoad.Data.Repository.OpenRoadEntities())
            {
                var appointments = (from e in entities.Appointments
                                    where e.UserId == OpenRoad.Web.Session.UserId
 
                                    select new Models.Calendar
                                    {
                                        TaskID = e.AppointmentId,
                                        UserId = e.UserId ?? '1',
                                        Title = e.Subject,
                                        Description=e.Description,
                                        Start = e.StartTimeUtc ?? DateTime.Now,
                                        End = e.EndTimeUtc ?? DateTime.Now,
                                        IsAllDay = false,
                                        
 
                                    }).OrderBy(o => o.Start).ToList();
                 
                return Json(appointments, JsonRequestBehavior.AllowGet);
            }            
        }
Vladimir Iliev
Telerik team
 answered on 12 Aug 2013
4 answers
790 views
I have my grid setup in batch edit mode.  I have a requirement for a user to add multiple rows to the grid which I have by prompting the user for how many new rows they want to add then looping through and calling addRow method.  The problem is that it doesn't scale very well.  Adding 10 rows seems to work fine but by the time you get to 50 it takes upwards of 30 seconds to add those rows.  Is there anything I can do to make this faster or delay the redrawing of the grid as I add rows?
Keith Pepling
Top achievements
Rank 1
 answered on 12 Aug 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?