Telerik Forums
Kendo UI for jQuery Forum
5 answers
230 views

Hi,

Combobox is not selecting the right item in the dropdown when using data virtualization for paging 

I have tried the same virtualization configuration(through K-option) with DropdownList but DropdownList selects the right item no matter how quick the text is inputted (as long as you don't tab out of the control).

Combobox without Virtualization also does not have this issue.

When using combobox with Virtualization and if the user types in quickly (only for the first time after launch), it selects the first element in page 0 instead of selecting the right element.

I have demonstrated this behavior in plunker. 

http://plnkr.co/edit/gFD8Ib3bOfbw19aklQho?p=preview

If you type in 'lg' quickly and wait, it selects, 'HTC'. Please let me know if I'm missing any configuration.

Thanks,

Deeptha

  

 

Alexander Valchev
Telerik team
 answered on 03 Nov 2015
2 answers
980 views
In my TreeView, while I have a node selected and I click another node in the tree, if I cancel the select via "e.preventDefault()" in my Select event handler, the selection is cancelled but the node I clicked retains focus.  Is there a way of preventing this (removing focus from the node I clicked)?  I tried adding code to remove the "k-state-focused" class from the node, but it does not work...

e.preventDefault();
$("#treeview_tv_active span.k-state-focused").removeClass("k-state-focused");

Thanks.
Dave
Top achievements
Rank 1
 answered on 03 Nov 2015
4 answers
396 views

I'm having an issue with the operator dropdown in the filter menu of my grid closing after I scroll to the top or bottom of the option list. I found this example on how to prevent that, but I can't figure out how to access the operator dropdown in the grid menu (I'm using angular directives, if that makes a difference)?

I also noticed that some of the grid examples have this behavior, but don't seem to use the method above. Is there another way to get this behavior?

Rahat Ahmed
Top achievements
Rank 1
 answered on 03 Nov 2015
5 answers
346 views

Hi folks, 

I am having kendo chart with two series. The first one is a scatterLine series and the second one is a simple scatter series with visible markers. Currently the second series is drawn first and the markers appear bellow the points from the scatterLine series, which makes them hard to see. I tried changing the order of the series, when they are defined, but this did not helped me. Tried switching the scatter with scatterLine and now the order matters. So how to proceed ​with this ​matter?

My second questions is about customizing the markers: how for example I can add an icon plus some text (which comes from the dataItem) next to it? I went trough your documentation, but wasn't able to find an answer.

 The third and final question is if there is a click event for the markers? Right now I use on click for series, but I want to isolate this only with clicking on the markers.

Kind Regards,

Zhivko

 

 

EZ
Top achievements
Rank 2
 answered on 03 Nov 2015
3 answers
505 views
When i  click on save/cancel button after editing I am getting  js error

Unhandled exception at line 11, column 31201 in http://localhost:60267/Scripts/kendo.web.min.js
0x800a138f - Microsoft JScript runtime error: Unable to get value of the property 'editable': object is null or undefined

Who could help?



<script>

    function siteDropDownEditor(container, options) {
        $('<input required data-text-field="SiteName" data-value-field="SiteId" data-bind="value:' + options.field + '"/>')
        .appendTo(container)
        .kendoDropDownList({
            autoBind: false,
            dataSource: {
                transport: {
                    read: {
                        url: "/Employee/PopulateSiteList",
                        dataType: "json"
                    }
                }
            }
        });
    }

    $(document).ready(function() {
        $("#gridEmployeeList").kendoGrid({
            dataSource: {
                serverPaging: false,
                serverSorting: false,
                pageSize: 300,
                transport: {
                    read: {
                        url: "/Employee/PopulateEmployeeList",
                        dataType: "json"
                    },
                    update: {
                        url: "/Employee/EmployeeUpdate",
                        dataType: "json"
                    }
                    //destroy: {
                    //    url: "/Destroy",
                    //    dataType: "json"
                    //},
                    //create: {
                    //    url: "/Create",
                    //    dataType: "json"
                    //}
                }
            },
            height: 648,
            scrollable: true,
            sortable: true,
            filterable: true,
            pageable: true,
            selectable: "row",
            toolbar: ["create"],
            editable: "inline",
            resizable: true,

            schema: {
                model: {
                    id: "id",
                    fields: {
                        id: { editable: false, nullable: false },
                        LohikaId: { editable: true, nullable: false, type: "string" },
                        LastName: { validation: { required: true }, editable: true, type: "string" },
                        FirstName: { validation: { required: true }, editable: true, type: "string" },
                        Site: { validation: { required: true }, editable: true, type: "string" },
                        Email: { validation: { required: true }, editable: true, type: "string" },
                        StartDate: { validation: { required: true }, editable: true, type: "date" },
                        EndDate: { validation: { required: false }, editable: false, type: "date" },
                        IsAdvocate: { validation: { required: true }, type: "number" },
                        NonActive: { validation: { required: true }, type: "number" },
                        DomainNameLastName: { validation: { required: true }, editable: true, type: "string" }
                    }
                }
            },

            columns: [
                {
                    field: "id", 
                    attributes: {
                        style: "display: none"
                    },
                    headerAttributes:{
                        style: "display: none"
                    }
                },

                { field: "LohikaId", title: "LohikaId"},
                { field: "LastName", title: "Last Name"},
                { field: "FirstName", title: "First Name"},

                { field: "Site",
                  title: "Site",
                  editor: siteDropDownEditor,
                  template: "#=Site.SiteName#"
                },

                { field: "Email", title: "Email" },

                { field: "StartDate", title: "Start Date", 
                  type: "date",
                  template: '#= kendo.toString(StartDate,"dd/MM/yyyy") #',
                  attributes: {
                        style: "text-align: right"
                  }
                },
                {
                     field: "EndDate", title: "End Date",
                     editable: true,
                     type: "date",
                     template: '#= kendo.toString(EndDate,"dd/MM/yyyy") #',
                     attributes: {
                         style: "text-align: right, display: none"
                     }
                 },

                { field: "IsAdvocate", title: "IsAdvocate", type:"boolean", template: "<input type=\"checkbox\" # if(IsAdvocate){ # checked #} # />" },
                { field: "NonActive", title: "Is Term", type: "boolean", template: "<input type=\"checkbox\" # if(NonActive){ # checked #} # />" },
                { field: "DomainName", title: "DomainName" },
                {
                    command: ["edit", "destroy"],
                    attributes: {
                        style: "width: 190"
                    },
                    headerAttributes:{
                        style: "width: 190"
                    }
                }
            ]
        });
    });

</script>

<div id="gridEmployeeList" ></div>
            

Iliana Dyankova
Telerik team
 answered on 03 Nov 2015
1 answer
184 views

I have a bootstrap icon in my Kendo Grid column header, which displays fine.

When I group by that column, the icon html gets 'encoded' into a string when the column moves into the 'grouped' box.

 Is there any way to stop this behaviour? As I want the icon to display at all times.

 

example code for the icon: "<i class='glyphicon glyphicon-star' title='​test tooltip'></i>"

 

Many thanks.

Kiril Nikolov
Telerik team
 answered on 03 Nov 2015
1 answer
127 views
Hi,
    
I'm trying to integrate the Kendo pivot grid with the Mondrian OLAP engine. Currently I'm facing an issue when I am trying to add the multiple dimensions to an axis manually, from the code I can add multiple dimensions to an axis initially, but when I add them through the UI,  Kendo UI breaks with the below script error.

"Unable to get property 'children' of undefined or null reference"

I noticed that extra cross-join is added to the query when adding the dimensions manually. I have attached the request/response files for the review.

Thanks
Georgi Krustev
Telerik team
 answered on 03 Nov 2015
1 answer
89 views

Hello,

I need to load data of 6 series in 3 charts on a selected period which can be many years.

The problem is that the data are aperiodic and sometimes there is only few seconds between samples.

I can't use the resampling because the user need to view the real timestamps.

 

​Here is what I try to do : https://gist.github.com/anonymous/334712463cad6a2029bb (Take care, the browser freeze with the code in this state)

In this example, the user selects a period of one year and there is only 57 samples in each series from may to july.

I would like to obtain the data in the middle of the charts with empty bands on each side and the shared tooltips when I move the mouse hover the charts.

 

Have you any suggestions, tips or guidelines to achieve what ​I need ?

 Many thanks

T. Tsonev
Telerik team
 answered on 03 Nov 2015
4 answers
292 views
Hi ,

We would like to format the category/date in the shared tooltip.
Just for convenience we have attached one screen shot to highlight the particular element.

In our case the category is date ( we want to format in "MMM dd" style in the shared tooltip) .

Thanks
 
Iliana Dyankova
Telerik team
 answered on 03 Nov 2015
11 answers
637 views

Hello,

I need to restore treeview checkbox's state from an object that doesn't reflects tree structure. Tree is already bound. The object contains list of items that are to be checked. These items can lay on different layers of the tree. To accomplish this i use dataItem.set() method. It works great if i need to call it less then 50 times. But once i do it 200+ times - it works really slow(about 6-7 second).

 Is there any way to improve performance of this method or do the same in different (faster) way?

 

Thanks a lot.

Siarhei
Top achievements
Rank 1
 answered on 03 Nov 2015
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?