Telerik Forums
Kendo UI for jQuery Forum
2 answers
184 views

Hello ,

I am trying to use custom editors for an editable kendo ui grid in my angular app. For some reason( which I am not able to trace) the custom editor is not triggered.
I am expecting the following to be triggered but it does not work.

console.log("Editor Launched", options);

Here is the plunker for the same: 

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

 

 

Stefan
Telerik team
 answered on 24 Aug 2017
10 answers
688 views

We have a large data grid with virtual scrolling (needed for performance), all data on client (server operation = false).

This is a big list of parts.

What is the best way to allow the user to scroll to a part number that is currently not rendered in the grid?

Marc
Top achievements
Rank 1
 answered on 23 Aug 2017
1 answer
241 views

Why isn't the menu scrolling working? I am trying to use it with the Angular directive.

<ul kendo-menu k-scrollable="true"

http://dojo.telerik.com/IFULi/2

Neli
Telerik team
 answered on 23 Aug 2017
3 answers
1.8K+ views

Hi Team,

I have a kendo grid ,that has each 10 column different filterable options.

Eg: column 1,2  and 3  has the below config

columns : [{
field : "xx",
title : 'xx'
filterable :operators: {
string: {
eq: "Equal to",
neq: "Not Equal to",
contains: "Contains",
doesnotcontain: "Does not contains",
startswith: "Starts with",
endswith: "Ends with"
},extra:false
}},

{
field : "yy",
title : 'yy'
filterable :operators: {
string: {
eq: "Equal to",
neq: "Not Equal to"
},extra:false
}},

{
field : "zz",
title : 'zz'
filterable :operators: {
string: {
eq: "Equal to",
neq: "Not Equal to",
contains: "Contains",
doesnotcontain: "Does not contains",
startswith: "Starts with",
endswith: "Ends with"
},extra:false
}}]

Now filter is applied to column 1, I need to change dynamically the column of 2 and 3 ,and I tried the below 

angular.element("#allApsGrid").data("kendoGrid").columns[1].filterable.operators.string = {contains:"Contains to"};
            angular.element("#allApsGrid").data("kendoGrid").columns[2].filterable.operators.string = {contains:"Contains to"};

 

But setting this dynamically is not reflecting in the kendo grid , I still see the old values of all operators. Can someone please help me here as how can I set custom per column filter dynamically ?
  

Tsvetina
Telerik team
 answered on 23 Aug 2017
1 answer
138 views

 I am dynamically trying to create CRUD grid in AngularJS .

I successfully created Grid by assigning dataSource to Grid Options Dynamically.

But I have having problems when I  click on Editting Data .

Clicking on Edit Command Button throws me an Error like this:

 

 Uncaught TypeError: Cannot read property 'slice' of null

    at ve._extractFormat (http://localhost:59366/kendo/js/kendo.all.min.js:27:19054)
    at new init (http://localhost:59366/kendo/js/kendo.all.min.js:175:2141)
    at HTMLInputElement.<anonymous> (http://localhost:59366/kendo/js/kendo.all.min.js:32:3585)
    at Function.each (http://localhost:59366/Scripts/jquery-1.10.2.min.js:21:5347)
    at M.fn.init.each (http://localhost:59366/Scripts/jquery-1.10.2.min.js:21:1999)
    at M.fn.init.e.fn.(anonymous function) [as kendoNumericTextBox] (http://localhost:59366/kendo/js/kendo.all.min.js:32:3559)
    at number (http://localhost:59366/kendo/js/kendo.all.min.js:196:1854)
    at init.editor (http://localhost:59366/kendo/js/kendo.all.min.js:197:709)
    at init.refresh (http://localhost:59366/kendo/js/kendo.all.min.js:200:795)
    at new init (http://localhost:59366/kendo/js/kendo.all.min.js:197:176)

 

Data Type of my Column is Number .

Can you give me an example of Dynamic Grid CRUD Edit and Update Operations ? So that I can know where I am going wrong.

Thanks .

 

Stefan
Telerik team
 answered on 23 Aug 2017
1 answer
182 views

Hello, i want to make last tooltip in series always visible, regardless of the hover effect. I found how to make all tooltips always visible, but it does`t help. Pls help me

my code:

<script>
 var stats1 = [
{
"value": 15,
"date":"24/01/16"
},
{
"value": 13,
"date":"26/01/16"
}
];
 
    function createChart() {
        $("#chart1").kendoChart({
            title: {
                text: ""
            },
            dataSource: {
                data: stats1
            },
            seriesDefaults: {
                    type: "area"
                },
            series: [{
                type: "area",
                field: "value",
            }],
            categoryAxis: [{
                labels: {
                    format: "d/M/yyyy",
                    rotation: -90
                },
                field: "date",
                baseUnit: "days",
               axisCrossingValues: [100]
            }],
            valueAxis: {
                    labels: {
                        format: "N0"
                    }
                },
             tooltip: {
                    visible: true,
                    format: "{0}%",
                    template: "#= kendo.format('{0:dd/MM/yyyy}',category) #: #= value #"
                }
           
        });
    }
    $(document).ready(createChart);
    </script>
Preslav
Telerik team
 answered on 23 Aug 2017
1 answer
466 views

if has a lot of data when first time type to search is very slow ,but after will quickly more

how to fix it?

and can I no mater how many results just show only 20 results

Ivan Danchev
Telerik team
 answered on 22 Aug 2017
5 answers
233 views

Hi,

I am working on an elevation profile chart.

I have a list of 200 distance-points given.: "distancePoints" : [0,222.22,433.3,620.44,822.24,1001.55 ... 5022.56

There a many unlovely values as labels on the categoryAxis like 5022.56, 10022.2 and so on... (see screenshot1).

Is there a possibilty to change the labels on the categroryAxis like 5000, 10000 and so on... (see screenshot2) without changing the list of distancePoints?

Thanks for helping.

 

Markus
Top achievements
Rank 1
 answered on 22 Aug 2017
2 answers
373 views

Hi,

My case is the following :

- At the top of my page I have a header

- On the rest, I have a splitter with orientation Horizontal, inside a div with width: 100%, weight: 100% )

When I move the splitter, header disappears;  but only with Chrome (It works correctly with FF & IE11 ...)

After investigations, the height calculated by the splitter is incorrect

I found a correlation with the fact that the offsetTop returned by Chrome is also incorrect

In fact, my page is not so simple as described previously : there is a lot a  nested div. And at one point, the offsetTop returns to 0

Here is the code that I have to add so that it works (sorry for the quality of the code, i'm a beginner javascript developer) :

 

var contInit = document.getElementById("Container-" + splitterId);
 var cont = contInit;
 var top = cont.offsetTop;
 var zero = false;
 while (cont.parentElement !== document.body) {
     cont = cont.parentElement;
     if (cont.offsetTop === 0) zero = true;
     else if (cont.offsetTop !== 0 && zero) {
            zero = false;
            top = top + cont.offsetTop;
     }
}
contInit.style.height = "calc( 100vh - " + top + "px )";
 var outerSplitter = $("#" + splitterId).data("kendoSplitter");
 if (outerSplitter != null)        outerSplitter.resize(true);

 

If you have a better solution, I'll take it 

 

Regards

Dimitar
Telerik team
 answered on 22 Aug 2017
1 answer
418 views

Below find my code. I am using MVVM to initate a range-slider. It appears that when the page loads, both knobs are to the left most side, instead of one at the min and one at the max. 

Please note: sometimes when the page loads, the knobs are positioned correctly. 

Please advise.

<script type="text/x-kendo-template" id="filterAgeTemplate">
        <div class="item--agerange">
            <div class="agerange-wrap">
                <div
                    data-role="rangeslider"
                    data-small-step="1"
                    data-large-step="10"
                    data-min="1"
                    data-max="100"
                    data-bind="value: ageRange, events: { change: vm_onAgeSelectorChange }" id="panel-filter__agerange" style="width:160px">
                    <input  />
                    <input />
                </div>
 
                <div class="agerange-title">Age Range</div>
            </div>
 
            <div class="agerange-btns ">
                <button class="button button__gray-outline"><span>Reset</span></button>
            </div>
        </div>
    </script>

 

Preslav
Telerik team
 answered on 22 Aug 2017
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
ScrollView
Switch
TextArea
BulletChart
Licensing
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
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
ContextMenu
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?