Telerik Forums
Kendo UI for jQuery Forum
3 answers
838 views

Hey guys,

I'm having trouble setting the focus to a column after I've just added a new row to my grid.

When I add a new row, I want to set the focus to a custom drop down editor I've implemented. However, if I override the edit function of the grid and set the focus to the drop down list, once the edit function is complete, the focus will be reset to the first editable cell in the row.

I have an example here: http://dojo.telerik.com/@gmeulendyks/eFinI/3

 

Clicking the "Add New Record" button should set focus to the Category drop down list.

 

Can someone tell me what I'm doing wrong in the edit function?

 

Thanks,

Graham

Graham
Top achievements
Rank 1
 answered on 05 Jul 2017
3 answers
2.1K+ views

We were using telerik version Kendo UI v2015.1.408 and recently upgraded to Kendo UI v2017.2.504 after which the server side pagination is not working fine. The sample code is as follows:

var allNameDataSource = new kendo.data.DataSource({
             serverPaging: true,
             serverFiltering: true,
             transport: {
                 read: {
                     url: "/StudentNames/Name/GetAllNames",
                     contentType: "application/json; charset=utf-8",
                     dataType: "json",
                     async: false,
                     type: "POST"
                 },
                 parameterMap: function (options, operation) {
                     debugger;
                     if (operation !== "read" && options) {
                         return JSON.stringify({
                             model: options
                         });
                     }
                     else if (operation == "read") {
                         debugger;
                         var sortOrderField = null;
                         var sortOrderValue = null;
                         var selectedSorting = allNameViewModel.allNameDataSource.sort();
                         if (typeof (selectedSorting) != "undefined" && selectedSorting.length > 0) {
                             sortOrderField = selectedSorting[0].field;
                             sortOrderValue = selectedSorting[0].dir;
                         }
                         var filterAndCondition = allNameViewModel.allNameDataSource.filter();
                         if (typeof (filterAndCondition) != "undefined" && filterAndCondition != null) {
                             if (filterAndCondition.filters.length > 0) {
                                 debugger;
                                 allNameViewModel.pushKendoCustomFilter(filterAndCondition);
                                 debugger;
                                 var CustomFilters = allNameViewModel.Filters;
                                 return JSON.stringify({ skip: options.skip, take: options.take, pageSize: options.pageSize, OrderByField: sortOrderField, OrderByValue: sortOrderValue, filter: allNameViewModel.filter, CustomFilters: CustomFilters });
                             }
                         }
                         return JSON.stringify({ skip: options.skip, take: options.take, pageSize: options.pageSize, OrderByField: sortOrderField, OrderByValue: sortOrderValue, filter: allNameViewModel.filter });
                     }
                 }
             },

           pageSize: PageCountValue > 0 ? PageCountValue: 10,
             schema: {
                 model: {
                     id: "StudentId",
                     fields: {
                         Name: { type: 'string' },
                         Age: { type: 'string' },                      
                        Address: { type: 'string' },
                         Email: { type: 'string' }                        
                   }
                 },
                 data: function (data) {
                     return data.data;
                 },
                 total: function (data) {
                     return data.total;
                 },
             }
         }),

Please let me know what is wrong with this.

Tsvetina
Telerik team
 answered on 05 Jul 2017
1 answer
348 views
I am having problem in Grid Asp.Net MVC. I require two datepickers in inline-edit mode. But one datepicker works fine and another doesnot work.
Inspecting the field  shows The 'Field' should be Date type. Both the fields are of same type but error is shown for the later one. I tried removing the first field and used second only but not any effect. Even I tried creating another editor template for later one and used it there still not.
Preslav
Telerik team
 answered on 05 Jul 2017
1 answer
293 views

Greetings!

I've got a kendo ui scheduler in my project and encountered a problem with displaying large number of events in view.

In attached image you can seen that the whole scheduler becomes unreadable with increase of events number. Is there any way to create some kind of button with number of events per time of day and open a dialog window with readable list of event in it.

 

Ianko
Telerik team
 answered on 05 Jul 2017
3 answers
106 views

I am using cordova version 6.4.0.

Here is a simple demo for what I want. (http://dojo.telerik.com/idAreK/2).

It works fine.

However, when i tried to call cancelChange() function, "Uncaught TypeError: grid.cancelChange is not a function " always pop up.

There is only one jquery.js file in the head. 

Thanks 

Stefan
Telerik team
 answered on 05 Jul 2017
7 answers
1.1K+ views

We are using a Kendo comboBox control, which behaves correctly if an option is selected by opening the dropdown list and clicking the option. However, the following behavior is observed when selecting an option by typing in the dropdown box:

-Start typing: a small list of corresponding options appears

-Select one of the options in the list: the seleted option appears in the dropdown box. So far the behavior is correct.

-Click the caret of the dropdown to expand the list of options.This has the result that the selected option changes to the last option of the dropdown list, and all the options are highlighted as if selected. Inspecting the HTML elements shows they all have class k-item and k-state-selected. 

What is causing this behavior? Shouldn't only one item at a time have the class k-state-selected? Is there some option that has to be set? I would be thankful for any help on this.

We are using Kendo UI v2016.1.322, Internet Explorer 11.0.9600.18314, Windows Server 2008 R2 Enterprise.

The HTML uses this directive as shown:

<sc-combo-box type="availYear" sc-filters="AvailYear" placeholder="Select Avail Year" default-value="'2016'"></sc-combo-box>

The comboBox control is built in the directive as follows:

var controller = function ($scope, $attrs, data) {
            var vm = this;
            vm.cbUUID = '';
            vm.type = '';
            vm.defaultValue = $scope.$parent.$eval($attrs['defaultValue']);.

:

:.

            vm.render = function (element, placeholder, type, scFilters) {

                vm.cbUUID = helper.guid().toString();
                vm.filterNames = scFilters.toString();
                vm.filterNames = scFilters.toString();               

                // establish new id for combobox
                element.attr('id', vm.cbUUID);

                // create datasource, establish options used when creating combobox and combine into one 'options' object
                var options = helper.concatObjects(vm.buildDataSource(vm.filterNames), {
                    placeholder: placeholder,
                    value: vm.defaultValue,      
                    filter: 'contains'
                });

                // established combobox options
                element.kendoComboBox(options);
            };
        };

        var directive = {
            link: link,
            require: 'scComboBox',
            restrict: 'E',
            replace: true,
            scope: {
                defaultValue: '='
            },
            controller: ['$scope', '$attrs', 'data', controller],
            template: '<select id="scComboBox" style="width: 100%"></select>'
        };

        return directive;

        function link($scope, $element, $attrs, ctrls) {

            ctrls.render($element, $attrs.placeholder, $attrs.type, $attrs.scFilters);       
        }        
    }

Dimiter Topalov
Telerik team
 answered on 05 Jul 2017
7 answers
2.7K+ views

Hi,

I'm trying to use the cancel event in a grid, but the event is never fired.

Code:

$("#grid").kendoGrid({
        editable: true,
        toolbar: ["create", "save", "cancel"],
        dataSource: _dataSource,
        columns: [{
            title: "Description",
            field: "description"
        }, {
            title: "Active",
            field: "active"
        }],
        edit: function (e) {
            console.log("add row");
        },
        cancel: function (e) {
            console.log("cancel row");
        }
});

When I click on "Add new record", the console shows "add row", but when I click on "Cancel changes" nothing shows up in the console.

It is a pretty simple code and it is following the documentation, but am I missing something?

Version: Kendo UI v2016.1.112

Thanks!

Stefan
Telerik team
 answered on 05 Jul 2017
2 answers
1.5K+ views

Hello All,

I cannot add a tooltip to both a toolbar button and a action button located in the grid row. Please look at my example exmple http://dojo.telerik.com/@iakhmedov1/aRUle and get it working.

 

Thanks,

Igor

 

Igor
Top achievements
Rank 1
 answered on 04 Jul 2017
2 answers
497 views

Hi Kendo UI Team,

I'm trying to create a custom editor for in cell editing within a kendo grid.  Our custom editor is a combination of your multiselect/treeview ui widgets.

The problem I am encountering is that when you click the cell and the editor appears, attempting to further interact with the editor will then cause the cell's custom editor to minimize - I suspect the grid thinks I am clicking out of the scope of the editor (because the editor is larger than the cell that contains the bound data and has absolute positioning below that cell) and thus closes it.  Is there any way to get around this problem?  As it is right now, I am unable to interact with the custom editor without it closing the cell's edit mode.

(unfortunately our custom editor is... complex... so I don't think I have a nice code sample to put here for you)

Best,

Jeff

Konstantin Dikov
Telerik team
 answered on 04 Jul 2017
5 answers
1.3K+ views

When i export a Kendo UI Grid to Excel (xlsx) file, it also exports the group footer template which in my case included hidden fields (<input type=hidden id="test"></input>)

Is there a way we can suppress the export of the group footer template and the group header template.

The header template also gets exported in the output xlsx file.

In my case the group header template looks like the following:

<script id="productCodeTemplate" type="text/x-kendo-tmpl">
    # var product = value; productArr = product.split(";"); #
    <span class="name" style="display: inline-block;width:500px;">Product Code: #: productArr[0]# </span>
</script>

The group footer template is as follows 

groupFooterTemplate: "<input type='hidden' class='totalFooter' value='#=count#'></input><span class='totalFooterSpan'>Total</span>"

Kindly see attached zip file for a sample of the exported excel.

Stefan
Telerik team
 answered on 04 Jul 2017
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?