Telerik Forums
Kendo UI for jQuery Forum
6 answers
209 views
Hi,
I'm having troubles replicating your examples.
I have scatter charts and I need to do the following:
1) setup a "selection" area so the user would be able to select some area on the graph.  It seems that "categoryAxis" is not valid for scatterline, but there's no mention for this in the docs.  In addition, why would "scatter/scatterline" should be missing the "select" feature? It makes no sense, since it's a great UI tool for any Cartesiangraph at least.

2) zoom in and out. I've tried replicating the demo (http://demos.telerik.com/kendo-ui/scatter-charts/pan-and-zoom) but it seems not to work for me (http://plnkr.co/edit/rbpfQOEub6FgiAYmz4F4?p=preview).  Each time I do "setOptions" it deletes all the data from the chart.

3) Using the data in the options: I would like to use the data inside the options - for instance, my data points look like this: 

{x: Xi, y: Yi, label: someLabel, group: groupName}

so I'd like to add the label to the tooltip when hovering over points in the graph. How can this be achieved using the tooltip template? 
Another thing is to set certain values according to the data.  Again, my data is made of an array of objects.  How can I set some conditions according to the data min/max for instance? How can I access the data while setting up the options. i.e.:
graphOpts = {
dataSource: dataSource,
xAxis: {
min: data.min,
max: data.max,
title: {text: "Values #=data.view().min=# to #=data.view().max=#}
}
}
Such that the title would show the min and max values of the axis, and the axis will be set according to the min and the max of the data (that's just an example of course... there can be many uses for this).

Thanks in advance.
{x: Xi, y: Yi, label: someLabel, group: groupName}
{x: Xi, y: Yi, label: someLabel, group: groupName}
{x: Xi, y: Yi, label: someLabel, group: groupName}
Viktor Tachev
Telerik team
 answered on 09 Mar 2020
4 answers
4.2K+ views
how would I format this AND use it in a ClientTemplate?

        columns.Bound(t => t.CreationDate)
        .Title("Date / Time")
        .Format("{0:dd-MMMM-yyyy}");
        //.ClientTemplate(
        //"<span>CreationDate</span>"
        //); 
Petar
Telerik team
 answered on 09 Mar 2020
7 answers
297 views

Hi, 

I want to implement tool tips for kendo UI timeline view and tool tip will be based on events color and event data which will be a customize tool tip using angularJs version.  

Please help..!!!

 

Thanks,

Lilan

K.Ramadan
Top achievements
Rank 2
Veteran
 answered on 09 Mar 2020
1 answer
1.0K+ views

I have an issue on grid filter

My data is: "Test  Data", this text have 2 spaces, but when i typing "test", filter auto trim space on my data and show "test data" and then grid filter wrong logic.

So what is solution in my case ?

thank you

Silviya Stoyanova
Telerik team
 answered on 06 Mar 2020
10 answers
224 views
Hi, 

I implemented "dynamic" filtering on our gantt widget, which basically allows user to show/hide tasks under certain conditions. 

However, filter is behaving differently on two datasets (same service returns response under different conditions).

For example: I have 130 items in my datasource, out of which 63 has status not equal to 3, and I have following filter: 

{
  "filters": [
    {
      "field": "status",
      "operator": "neq",
      "value": 3
    }
  ]
}

After I apply filter, result is not 63 items displayed, but approx 100, where obviously some don't meet criteria (have status 3).
If I load a different project and apply the same filter, for the same filter it rules out all items, and widget is empty.

Strange thing is that at the same time, filter based on object type (we have property in datasource realObjType) works normally for both datasets.

{
  "filters": [
    {
      "field": "realObjType",
      "operator": "neq",
      "value": 7
    }
  ]
}

I compared responses, and they have identical structure, fields we are filtering are in same and correct type.
Only obvious difference between two project is in number of items. 

I would appreciate a suggestions, as we have a some time pressure.

Thanks and best regards, 
Vedad
Vedad
Top achievements
Rank 3
Bronze
Bronze
Iron
 answered on 06 Mar 2020
1 answer
909 views

Hi Telerik,

 

We did the security scanning for our website using Acunetix Security Scanner. We received summary that related to Kendo UI.

4. Absence of Anti-CSRF Tokens [Low]
Trigger by : Kendo All min.js , and those MVC form which do know have @Html.AntiForgeryToken()
Solution : For kendo,don’t have yet.
For MVC form which do not used form submit feature, change <form> to <div> html tag.
For MVC form which used form submit , add @Html.AntiForgeryToken(), MVC controller will auto received and validate this token when form being submit.

 

I was wondering if you could give me some advice about this.

 

 

Veselin Tsvetanov
Telerik team
 answered on 06 Mar 2020
5 answers
299 views

Hello,

IE Version 11.93.17763.0

Gantt task scroll issue:

1. Scroll down to some task

2. Select task

3. Then scroll for task list move to zero (look screen)

Veselin Tsvetanov
Telerik team
 answered on 06 Mar 2020
7 answers
751 views

Hello,

I am dealing with data split into two categories.

My project is based on this : https://demos.telerik.com/kendo-ui/bar-charts/grouped-data

I need it to be likeit is in the attachment

I think I need something like extra categoryField in a serie

Preslav
Telerik team
 answered on 05 Mar 2020
1 answer
7.5K+ views
hello!!
I'm trying to create a dropdownlist mutliselect.
in fact I have two dropdownlist that I consider as a parent and the other as a child.
when I select a parent in the first dropdownlist, a list of child  appears in the other dropdownlist. You can choose several child for one parent.  For this I used checkbox ,creating a template as follows:

------
<script type="text/x-kendo-tmpl" id="myTemplate">
    #if (ID){#
       <div class="item click" data="${ID}">
        <input id ="${ID}" type="checkbox" class="click xxx_${ID}" value="${ID}" />
        <span class="checkbox">#:Name#</span>
      </div>
    #}#
</script>
--------
my dropdownlist are:
-----

 var dropdownlistChapterParent =$('#IDChapterTemplates_' + e + '').each(function () {
                                           var combobox = $(this);
                                           var dropdownlistChapterParent= combobox.kendoDropDownList({
                                                optionLabel: "            ",
                                                dataTextField: "Name",
                                                dataValueField: "ID",
                                                dataSource: {
                                                     data: Chapters
                                                 },
                                                change: function () {
                                                     var DataItem = combobox.data("kendoDropDownList").dataItem();
                                                     combobox.parent().find('#ChapterTemplateID_'+e+'').val(DataItem.ID);
                                                     parentid=DataItem.ID;
                                                     $.ajax({
                                                        type: 'GET',
                                                        template: kendo.template($("#myTemplate").html()),
                                                        url: '@Url.Action("GetChapterTemplatefils","Reports")',
                                                        data: { chaptertypeid: parentid },
                                                        success: function (response) {
                                                         
                                                           $('#IDchapterTemplatefils_'+str1+'').data('kendoDropDownList').dataSource.data(response);
                                                        }
                                                      });
                    
                                                 }

                                            }).data("kendoDropDownList");
                                            dropdownlistChapterParent.select(function(DataItem) {
                                              return DataItem.ID == value.TemplateID;
                                            });
                                       });

                                       var dropdownlistChapterChild=$('#IDchapterTemplatefils_' + e + '').each(function () {
                                             var combobox = $(this);
                                             combobox.kendoDropDownList({

                                                 optionLabel: "            ",
                                                 dataTextField: "Name",
                                                 dataValueField: "ID",
                                                 template: kendo.template($("#myTemplate").html()),
                                                 dataSource: {

                                                     transport: {
                                                         read: {

                                                             url: '@Url.Action("GetChapterTemplatefils","Reports")?chaptertypeid=' + value.TemplateID

                                                         }
                                                     },
                                                     schema: {
                                                         model: {
                                                             ID: "ID",
                                                             Name: "NAME"
                                                         }
                                                     }
                                                 },
                                                 change: function () {
                                                     var DataItem = combobox.data("kendoDropDownList").dataItem();
                                                     combobox.parent().parent().find('#ChapterTemplatefilsID_' + e + '').val(DataItem.ID);
                                                 }
                
                                             });
                                         }).data("kendoDropDownList");
-----------------------
-----------
for example, if I am having parent1 and child11 child12 child13 like child (for  parent1). I select clihd11 and i save. After i I am considering an edition. Normally child11 must be checked. I check child12. I have now child11 child12 .
my questions are:
1-
var child=value.ChapterChild;
 alert("Press  ok!");

  var h  = 0;
   if (child.length>= 1) {
          for(h=0;h<child.length;h++){
                                                
                 $('.xxx_'+child[h]).attr('checked','checked');
               }
  }
I can not remove "alert("Press  ok!");" because  when I click "edit" child11 is not checked?????????

2- when I checked child11 and child12 and if I get the values ​​that are checked, I  have child11 child11 child12. That's false beacause I 'll have child11 child12.
II get the value of checkbox as follows:
---
 var checkboxes = $("#IDchapterTemplatefils_" + j + "-list .click:checked");
                     var values = [];
                   
                     console.log(checkboxes);
                     $(checkboxes).each(function(i, elt){
                         values.push($(elt).val());

                     });
----
and  when I debug my project with firebug. I have  two #IDchapterTemplatefils_1-list as id .

thank you  for  help
Steve
Top achievements
Rank 1
 answered on 04 Mar 2020
1 answer
274 views

I am using kendo UI sortable without grid in my application. But it seems IE browser is not compatible for it. Our application is using AngularJS with select and ng-repeat. I was able to get it work for Chrome and Firefox but not with IE. Below is the code snippet for HTML

<select class="form-control" kendo-sortable k-on-end="endHandler(kendoEvent)" 
            k-placeholder="placeholder" k-hint="hint" id="favorite_reports" selectedClass= "selected"
            multiple ng-model="favoriteReports.chosenReports">
        <option ng-repeat="link in config.links">
            {{link.NAME}}
        </option>
</select>

JS:

$scope.endHandler = function (e) {
        var sortable = e.sender;
        // prevent the sortable from modifying the DOM
        e.sender.draggable.dropped = true;
        e.preventDefault();
        // update the model and let Angular update the DOM
        $timeout(function () {
            $scope.$apply(function () {
                $scope.config.links.splice(
                  e.newIndex, 0, $scope.config.links.splice(e.oldIndex, 1)[0]
                );
            });
        });
    };
    $scope.placeholder = function (element) {
        return element.clone().addClass("placeholder").text("drop here");
    };
    $scope.hint = function (element) {
        return element.clone().addClass("hint");
    };

 

And when I use ul and li instead of select, sortable function is not working as expected in chrome, IE and other browsers as well. When I try to drag one element, next element from the queue has the index change and couple of other issues. 

Could you please give me a working example for kendo with sortable functionality (not grid) which uses select and ng-repeat and works for ALL THE BROWSERS as well as AND we can disable the sortable functionality onClick on list for other functionality.

 

Also onClick, I was trying to get the e.currentTarget.selectedOptions.length value which is having the issue with IE saying as selectedOptions is undefined and chrome is working as expected. 

Also I am trying to achieve "multiple" for onClick functionality to remove from the list and add it to other list. (FYI)

Please let me know, if there is any example links or code snippet which works for all browser.

 

Thanks in advance,

Sujatha

 

 

 

Preslav
Telerik team
 answered on 04 Mar 2020
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
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
ContextMenu
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?