I'm currently creating a Scheduler to manage a group of X people. I currently have checkboxes to filter out people but this simply removes those events from the scheduler and the rows remain in place.

I've managed to remove the person from the table row header by simply searching for the name of the person being checked but I'm a bit lost as to how I would also remove their row?

Cheers,

In our web application we are switching the active view content as documented using the build in showIn function of the layout class

During debugging sessions we have noticed, that this method also invokes the show method of the current active view and not only the new view.

We are not quite sure if this is working as designed or if there is a misconfiguration from our side.

Is it possible to prevent this behaviour?

Thanks in advance.

Regards

Patrick

Hello,

I need to render HTML content inside some grid cells. So i used the #= # syntax to test if the content is rendered correctly. I embedded the field into <p>-tags to test the simplest case of HTML contents so that it looks like: #= <p>fieldName</p> #

The result is a JavaScript error saying "Invalid Template".

Is the #= # syntax supported for row templates? Because I need this feature in a row template.

As further information: If I change #=<p>fieldName</p> # to #: fieldName # my template works properly.

Regards

Sebastian

Really easy to work around, but worth mentioning to the team.

AngularJS can add the class 'ng-scope' to the beginning of the 'class' attribute for the tr elements, and alternate rows add k-alt before that.  The result is that the css selector 'k-ios7 [class^=k-]' will apply only to the rows with k-alt since the ng-scope class breaks the starts-with assumption.  The result is a visual fluke where non-alternate rows select with background-clip: content-box and alternate rows select with border-box.

I want to open modal popup when kendo-grid header is double clicked.I tried the following

This way, the popup opens correctly but it also sorts the grid (default grid functionality).

Please suggest how to prevent grid from sorting when header is double clicked.

I'm using the combobox in an AngularJS application.
The list items use a custom template that show multiple columns of data. 

e.g.
[selected value] [v]
[option list column 1  | col2    | col 3   | col4 ]
[option list column 1  | col2    | col 3   | col4 ]
[option list column 1  | col2    | col 3   | col4 ]
[option list column 1  | col2    | col 3   | col4 ]
[option list column 1  | col2    | col 3   | col4 ]

The trouble is that the options list is set to the width of the input field, but the options are much wider than that field.
I need the width of the options list to be wide enough to show all the columns in the options template without scrolling.

The documentation shows how you can make the list items for a combobox wider than the input box using jQuery.

<input id="comboBox" />
<script>
    var combobox = $("#combobox").data("kendoComboBox");
    // set width of the drop-down list
    combobox.list.width(400);
</script>

How can you do this in an Angular application?

My Angular template looks like this:
<select id="property"
  kendo-combo-box                         
  k-options="propertyOptions">
</select>

With controller code that looks like this:

            $scope.propertiesDataSource = new kendo.data.DataSource({
                data: property_list
            });    
  
            $scope.propertyOptions = {
            dataSource: $scope.propertiesDataSource,
            dataTextField: "PropertyName",
            dataValueField: "PropertyID",
            // using {{angular}} templates:
            valueTemplate: '<span>[{{dataItem.UtilityAccountID}}] {{dataItem.PropertyName}}</span>',    
            template: '<span class="k-state-default" style="width:800px"><div class="combobox-item" style="float:left;white-space:nowrap;width:45px;">{{dataItem.UtilityAccountID}}</div><div class="combobox-item" style="float:left;white-space:nowrap;width:85px;">{{dataItem.PropertyName}}</div><div  class="combobox-item" style="float:left;white-space:nowrap;width:155px;">{{dataItem.City}}</div></span>'            
        };  

Furthermore,

Can it handle edge cases like a drop list on the right side of your page positioning to the right side of the input control instead of the left side?
If the positioning was set from the left then the list would overflow the right side of the screen.

Hello,

I have an issue when I do a drag and drop event when the resources' datasource is filled by a remote service. The error message is something like "cannot read property 'value' of null" (I'm not 100% sure of translation of the message since I have it in French).

I don't have any issue if I double-click on an task to edit it and then close it or if the datasource is hardcoded in json.

Thank you. 

    $(document).ready(function () {
                    initScheduler(new Date());
                });

                var initScheduler = function (date) {
                    kendo.culture("fr-BE");
                    $("#scheduler").kendoScheduler({
                        date: moment(date).hours(0).minutes(0).seconds(0).toDate(),
                        startTime: moment(date).hours(7).minutes(0).seconds(0).toDate(),
                        eventHeight: 40,
                        majorTick: 60,
                        eventTemplate: $("#event-template").html(),
                        dataSource: {
                            sync: function () {
                                this.read();
                            },
                            transport: {
                                batch: true,
                                read: {
                                    url: "Services/ServiceScheduler.asmx/GetInterventions",
                                    type: "POST",
                                    contentType: 'application/json; charset=utf-8',
                                    dataType: 'json',
                                    data: { pDate: moment(date).format("DD/MM/YYYY") },
                                    cache: false,
                                    complete: function (e) {
                                        $('<p>- Interventions ok</p>').appendTo('#console');
                                    }
                                },
                                update: {
                                    url: "Services/ServiceScheduler.asmx/UpdateInterventions",
                                    contentType: 'application/json; charset=utf-8',
                                    dataType: "json",
                                    type: "POST"
                                },
                                parameterMap: function (options, operation) {
                                    if (operation !== "read") {
                                        return kendo.stringify({ models: kendo.stringify(options) });
                                    } else {
                                        return kendo.stringify(options);
                                    }
                                }
                            },
                            schema: {
                                data: function (data) { // the data which the data source will be bound to is in the values field
                                    return data.d; //Sinon ça plante!
                                },
                                model: {
                                    id: "taskID",
                                    fields: {
                                        taskID: { from: "TaskId", type: "number" },
                                        roomId: { from: "RoomId", type: "number" },
                                        start: { from: "DateDebut", type: "date" },
                                        end: { from: "DateFin", type: "date" },
                                        title: { from: "Description" },
                                        description: { from: "Description" },
                                        PatientDescription: { from: "PatientDescription", editable: "true" }
                                    }
                                }
                            },
                            error: function (e) {
                                console.log(e.errors); // displays "Invalid query"
                            }
                        },
                        views: [
                            { type: "timeline", selected: true }
                        ],
                        group: {
                            resources: ["Salles"],
                            orientation: "vertical"
                        },
                        resources: [
                            {
                                field: "roomId",
                                name: "Salles",
                                dataSource: {
                                    transport: {
                                        read: {
                                            url: "Services/ServiceScheduler.asmx/GetRooms",
                                            dataType: "json",
                                            contentType: "application/json; charset=utf-8",
                                            type: "POST",
                                            complete: function (e) {
                                                $('<p>- Salles ok</p>').appendTo('#console');
                                            },
                                        }
                                    },
                                    schema: {
                                        // describe the result format
                                        data: function (data) { // the data which the data source will be bound to is in the values field
                                            return data.d; //Sinon ça plante!
                                        },
                                        model: {
                                            id: "value",
                                            fields: {
                                                value: { from: "IDAgenda", type: "number" },
                                                text: { from: "Description" }
                                            }
                                        },
                                        error: function (e) {
                                            console.log(e.errors); // displays "Invalid query"
                                            //alert("alalal");
                                        }
                                    }
                                },
                                parameterMap: function (options, operation) {
                                    if (operation !== "read" && options.models) {
                                        return { models: kendo.stringify(options.models) };
                                    }
                                }
                            }
                        ]
                    });
                }

Resources datasource from my remote service :

{"d":[{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1737,"Description":"Infirmière instrumentiste XXXXX"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1660,"Description":"Marie Curie Dicom"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1709,"Description":"Marie Curie Salle 0"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1689,"Description":"Marie Curie Salle 01"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1682,"Description":"Marie Curie Salle 02"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1548,"Description":"Marie Curie Salle 03"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1584,"Description":"Marie Curie Salle 04"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1688,"Description":"Marie Curie Salle 05"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1704,"Description":"Marie Curie Salle 06"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1728,"Description":"Marie Curie Salle 08"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1686,"Description":"Marie Curie Salle 09"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1585,"Description":"Marie Curie Salle 10"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1683,"Description":"Marie Curie Salle 12"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1736,"Description":"Marie Curie Salle Cathé Cardio"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1735,"Description":"Marie Curie Salle EEP"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1702,"Description":"Marie Curie salle endoscopie 1"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1703,"Description":"Marie Curie salle endoscopie 2"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1643,"Description":"Z Test Marie Curie Angio Vidéo"},{"__type":"GestionRendezVous.Services.RoomsTask","IDAgenda":1610,"Description":"Z Test Marie Curie Vidéo"}]}

Hi,

I'm have found the following example for pure JQuery:

http://jsfiddle.net/7PXu7/70/

So basically its about moving an item from 1 box to another. I have been trying to replicate this with AngularJS but without success.

Does anyone have a similar example to this fiddle but within an AngularJS setup?

Thanks,

Arno