Telerik Forums
Kendo UI for jQuery Forum
5 answers
1.3K+ views
Hi,

I would like to make a chart with multiple category axes that are grouped.  So the data might look something like the attached screenshot (data.png).  I want the chart to look similar to the attached Excel chart (chart.png).  I've tried making multiple, independent category axes in Kendo.  The problem is that the labels in the lower axis (the countries in this example) are spaced out equally instead of being grouped with the upper axis labels (the cities).  There may be a different numbers of cities for each country, so spacing them out equally doesn't work.  The long tick marks would be nice, but they're not required.  Mainly, I just need the countries to appear correctly below the cities in those countries, even if there are a different number of cities in each country.  Is there a way to do this in Kendo?

Regards,
Hughes
Teya
Telerik team
 answered on 29 Aug 2019
3 answers
455 views

Hi Guys,

I have been using Kendo UI for our AngularJS Application. The version I am using now is v2015.2.805. Recently I have updated the angular version to 1.4.8. Still the Kendo works fine. Now when I am trying to update the kendo version to v2015.3.930. All the kendo components like kendo-grid etc. doesn't work. And it doesn't give any error in the console too. 

I am basically updating the old kendo.all.js with the new kendo.all.min.js and requiring it as such in my main.js.

 

I can't figure out why this is happening. Is there any dependency issue that I missing? I through direction would be very much helpful for me. Thanks in advance guys.

 

Nencho
Telerik team
 answered on 29 Aug 2019
2 answers
154 views

    I have an issue with  resizable grid columns when the scroll of the page is moved from left to right. 
The columns can be resizable, with the  mouse, ONLY when the scroll has a fixed position, in the left of the grid . 
In case the list has more columns then the scroll, and the scroll is moved to the right, the resizable property is not working. The columns cannot be resizable using drag and drop any more.

Regards, 

   Cristina

Cristina
Top achievements
Rank 1
 answered on 29 Aug 2019
1 answer
176 views

Hi,

I was able to remove the validation method from the gantt. However, when I remove the date, its not making it empty and retaining its old value. Is there any way to be able to remove the date and make it not mandatory? https://dojo.telerik.com/ofUnAdit

 

Thanks!

Petar
Telerik team
 answered on 28 Aug 2019
1 answer
222 views

Hi all,

 

So for a good long time (A few years) I have been trying to get a telerik example to work.

I have follow the tutorials here and even tried to follow items on Plural site and other resources and 

they are all so very confusing. 

Let me ask this for clarity 

 

I am reading this example

Creating Applications
This article demonstrates how to use Telerik UI for ASP.NET MVC in ASP.NET MVC 5 applications.

https://docs.telerik.com/aspnet-mvc/getting-started/asp-net-mvc-5

 

 

Why do the instruction tell the user to copy element of kendo into your contents and scripts folders and 

then in the next few steps have your reference the CDN links??

Why are we being asked to copy elements to the scripts folder but the application uses information else where?

COuld this be why my datepicker does not work? Do we do both steps or do we do just one?

 

 

Nikolay
Telerik team
 answered on 27 Aug 2019
1 answer
6.7K+ views

How do you clear (reset) DropDownList selection in kendo UI for angular 2?

Thanks

Sully
Top achievements
Rank 1
 answered on 26 Aug 2019
1 answer
167 views

I am using Kendo Grid for MVC using Razor binding and want help with couple of features.

  • Frstly, i want to remove the filter option from Edit Column settings menu which comes when using GridFilterRow. (Attached screenshot of the same)

  • Secondly, I want to remove the "More Pages" option from Paging. (Attached screenshot)

 

Could I get some solution for the above?

 

 

Lance | Senior Manager Technical Support
Telerik team
 answered on 26 Aug 2019
1 answer
122 views

I was looking the telerick date time picker example found here: 

https://docs.telerik.com/aspnet-mvc/getting-started/asp-net-mvc-5

It all failed to work for me. But this part of the example's instructions are confusing....

What does this mean?

 

Use CDN Services
Below are listed the steps for you to follow when including the Telerik UI for ASP.NET MVC JavaScript and CSS files from CDN.
Replace kendo ui version from the following code snippets with the current version of the product—for example, 2013.2.918.

 

 

My guess this is there way of saying that the example will not work but look at something from 2013???

This is beyond frustrating. Why can they post an example that works??

What part of the example is wrong... This is why I quit trying to user this telerik nonsense.

But maybe some one can explain?

 

Thanks in advance 

Viktor Tachev
Telerik team
 answered on 26 Aug 2019
8 answers
221 views

For 3 or maybe four years I have tried to understand and make telerik work... and it is just impossible to get this thing to work in a simple MVC application... Clearly people make it work... but for me it's not possible it seems.

 

I have followed all the steps to get telerik into my application and when it comes to making the datetime picker work... it does nothing..

So let me ask.

 

If I have an existing MVC application that has a datatime picker working in it 

Is it not possible to get the telerik date time picker to work?

 

This what I have now and this used the datetime picker that id default to the MVC I am guessing 

                <div class="form-group">

                    @Html.LabelFor(model => model.RES_START_DATE, htmlAttributes: new { @class = "control-label col-md-3" })

                    <div class="col-md-6">

                        @Html.EditorFor(model => model.RES_START_DATE, new { htmlAttributes = new { @class = "datepicker" } })
                        @Html.ValidationMessageFor(model => model.RES_START_DATE, "", new { @class = "text-danger" })
                    </div>

 

The above code work just fine with a datetime picker that must be a default thing...

 

But as soon as I added the attempt to use the Kendo dateime picker as listed in the example I get nothing ..

I am following these directions... (see below)and I have been trying to get any telerik control to work for 3 years with no luck

I must be doing something wrong. I come back everything I write an application because the controls look so nice...

but I end up with the same result. Nothing

https://docs.telerik.com/aspnet-mvc/getting-started/asp-net-mvc-5#add-telerik-ui-for-aspnet-mvc

When I add: @(Html.Kendo().DatePicker().Name("datepicker"))

To my mvc application I get nothing but a blank field... each and every time I try...

Pure Kendo nothingness...

Also in the browser's f12 view I get what you see in the screen shots.

I am pretty much giving up on telerik after this attempt so this nightmare can be over..

but since I have the forums I thought I would give it one my try.

 

Please see screen shots if you have time to assist as I am totally lost! Thank You!

 

Viktor Tachev
Telerik team
 answered on 26 Aug 2019
2 answers
264 views

I'm having trouble with the shapeMouseEnter event not firing on any layer but the last one added (top layer).  I have a background layer using the openmap.org, and then I have 2 GeoJSON layers.  These layers don't overlap, one is the US counties, and the other is all the other countries of the world.  The problem is that the shapeMouseEnter only gets triggered on the layer that was added last to the map.  I thought that the shapeMouseEnter event should fire for all layers with shapes.  Is this not correct?  Here is an example of my map definition:

var colors = ['#9ecae1', '#6baed6', '#4292c6', '#2171b5', '#08519c', '#08306b'];
 
// create the map with the markers
$("#kendoMapCounty").kendoMap({
    center: [38.891033, -95.437500],//[30.268107, -155.744821],
    zoom: 4,
    controls: {
        attribution: false,
        navigator: false
    },
    wraparound: false,
    layers: [
    {
        type: "tile",
        urlTemplate: "//#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
        subdomains: ["a", "b", "c"],
        attribution: "© <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>"
    },
    {
        type: "shape",
        dataSource: {
            type: "geojson",
            transport: {
                read: "/Resources/kendoui/GeoJSON/world_countries_and_us_counties.geo.json"
            }
        }
    },
    {
        type: "shape",
        dataSource: {
            type: "geojson",
            transport: {
                read: "/Resources/kendoui/GeoJSON/tl_2010_us_county10_simplified.json"
            }
        }
    },
    ],
    shapeCreated: function (e) {
        var dataItem = e.shape.dataItem;
        var id = dataItem.properties.GEOID10;
        if (typeof id !== "undefined") {
            SL.shapesById[id] = SL.shapesById[id] || [];
            SL.shapesById[id].push(e.shape);
 
            var STATEFP10 = parseInt(e.shape.dataItem.properties["STATEFP10"]);
            if (STATEFP10) {
                e.shape.fill(colors[STATEFP10 % colors.length]);
                e.shape.options.set("fill.opacity", 0.0);
            }
 
            if (SL.selectedCounties.length > 0) {
                $.each(SL.selectedCounties, function (key, value) {
                    if (value.dataItem.properties.GEOID10 === id) {
                        e.shape.options.set("fill.opacity", 0.8);
                    }
                });
            }
        }
 
        id = dataItem.properties.iso_n3;
        if (typeof id !== "undefined") {
            var diss_me_id = dataItem.properties.diss_me;
            SL.shapesById[id] = SL.shapesById[id] || [];
            SL.shapesById[id].push(e.shape);
 
            var typeCode = e.shape.dataItem.properties["type"];
            if (typeCode === 'State') {
                var diss_me = parseInt(e.shape.dataItem.properties["diss_me"]);
                if (diss_me) {
                    e.shape.fill(colors[diss_me % colors.length]);
                    e.shape.options.set("fill.opacity", 0.0);
                }
            }
            else {
                var iso_n3 = parseInt(e.shape.dataItem.properties["iso_n3"]);
                if (iso_n3) {
                    e.shape.fill(colors[iso_n3 % colors.length]);
                    e.shape.options.set("fill.opacity", 0.0);
                }
            }
 
            if (SL.selectedStates.length > 0) {
                $.each(SL.selectedStates, function (key, value) {
                    if (typeCode === 'State') {
                        if (value.dataItem.properties.diss_me === diss_me_id) {
                            e.shape.options.set("fill.opacity", 0.8);
                        }
                    }
                    else {
                        if (value.dataItem.properties.iso_n3 === id) {
                            e.shape.options.set("fill.opacity", 0.8);
                        }
                    }
                });
            }
        }
    },
    markerCreated: function (e) {
        // Draw a shape (circle) instead of a marker
        e.preventDefault();
    },
    click: SL.onClick,
    reset: SL.onReset,
    pan: SL.onPan,
    panEnd: SL.onPanEnd,
    shapeClick: SL.onShapeClick,
    shapeMouseEnter: SL.onShapeMouseEnter,
    shapeMouseLeave: SL.onShapeMouseLeave,
    zoomStart: SL.onZoomStart,
    zoomEnd: SL.onZoomEnd
});

Ofer
Top achievements
Rank 1
 answered on 25 Aug 2019
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?