Telerik Forums
Kendo UI for jQuery Forum
5 answers
564 views

After looking at numerous examples of templates, I have noticed a common thing: they are declared as a <dl></dl>. Is there a particular reason for this? Here are my templates:

<script type="text/x-kendo-tmpl" id="template">
    <div class="product-view k-widget">
        <dl>
            <dt>Terminal</dt>
            <dd>#= getTerminalTitleActual(TerminalId) #</dd>
            <dt>Service</dt>
            <dd>#= ServiceId #</dd>
            <dt>Fee</dt>
            <dd>#= ServiceFee#</dd>
            <dt>Card</dt>
            <dd>#= ParkingCardNumber #</dd>
            <dt>Issued On</dt>
            <dd>#= ParkingCardIssueDate #</dd>
            <dt>Expiry Date</dt>
            <dd>#= ParkingCardExpiryDate #</dd>
        </dl>
 
        <div class="edit-buttons">
            <a class="k-button k-edit-button" href="\\#"><span class="k-icon k-edit"></span></a>
            <a class="k-button k-delete-button" href="\\#"><span class="k-icon k-delete"></span></a>
        </div>
    </div>
</script>
 
<script type="text/x-kendo-tmpl" id="editTemplate">
    <div class="product-view k-widget">
        <dl>
            <dt>Terminal</dt>
            <dd><input name="TerminalId" data-source=terminals data-role="dropdownlist" data-text-field="TerminalName" data-value-field="TerminalId" /></dd>
            <dt>Service</dt>
            <dd><input name="ServiceId" data-source=services data-role="dropdownlist" data-text-field="NameEnglish" data-value-field="Code" /></dd>
            <dt>Fee</dt>
            <dd><input type="text" data-bind="value:Fee" data-role="numerictextbox" data-type="currency" name="Fee" required="required" /></dd>
 
            <dt>Card</dt>
            <dd><input type="text" data-bind="value:ParkingCardNumber" class="k-input k-textbox" name="ParkingCardNumber" required="required" /></dd>
            <dt>Issued On</dt>
            <dd><input type="text" data-bind="value:ParkingCardIssueDate" data-role="datepicker" data-format="dd-MMM-yyyy" name="ParkingCardIssueDate" required="required" /></dd>
            <dt>Expiry Date</dt>
            <dd><input type="text" data-bind="value:ParkingCardExpiryDate" data-role="datepicker" data-format="dd-MMM-yyyy" name="ParkingCardExpiryDate" required="required" /></dd>
        </dl>
        <div class="edit-buttons">
            <a class="k-button k-update-button" href="\\#"><span class="k-icon k-update"></span></a>
            <a class="k-button k-cancel-button" href="\\#"><span class="k-icon k-cancel"></span></a>
        </div>
    </div>
</script>

Now this renders a card but I'd like to go for a landscape view with 3 rows and three columns. Can we have customized layouts using bootstrap or tables for templates?

 

Dimiter Topalov
Telerik team
 answered on 30 Jun 2016
4 answers
481 views
I'm having an issue with the Grid when I set "scrollable {virtual: true}" when it's viewed on a Mac in either Chrome or Safari.  On Windows it works fine.  If "scrollable: true" is used instead, the scrollbars work as they should.

If the Grid fits horizontally, and needs to scroll vertically, the vertical scroll bar never shows, although you can still scroll using the mouse wheel.

If the Grid fits vertically, but needs to scroll horizontally, the horizontal scroll bar never shows, and I haven't noticed a way to get it to scroll horizontally.

Here's a simple example showing the second case:
http://jsfiddle.net/jxPF6/3/

I'll keep trying to find a work-around and will post any more info i dig up.
Dimo
Telerik team
 answered on 30 Jun 2016
4 answers
180 views

Hi!

I have an issue when combining to chart-types (column and area) into one chart. The Column-chart is using Y-axis 1, the Area uses Y-axis 2.

The Area-chart is used only to mark a periode of time (along the X-axis). And the value of the Area-chart series is always "1". The Column-chart has both positive and negative values.

So, the problem is that the Area-chart is using the 0-value from the Y1-axis, not the Y2-axis (which it does belong to). The included picture demonstrates this more clearly.

Can anyone give me a hint to how to make the Areachart start on its own 0-value (from the Y2 axis), instead of the Y1's 0-value?

 

Thanks!

 

Jon

 

 

Jon
Top achievements
Rank 1
 answered on 30 Jun 2016
1 answer
128 views

Hi, 

today Microsoft published the 1.0 RTM of Asp.Net Core, with Visual Studio 2015 update 3.

Can we use it with Kendo UI just fixed for the RC2 ?

 

Thanks for the support !

Rumen
Telerik team
 answered on 30 Jun 2016
5 answers
1.1K+ views

when i remove an dom element all effect still exist in kendo, and kendo try to get injector of those removed elements that i removed.
how can i destroy them to stop kendo for get the injector of them.
the function of kendo is setupRebind
and here is my code:

 

function removeAllChildren(level) {
    if (vm.dataLevel.length > vm.currentSender + 1) {
 
        for (var i = vm.dataLevel.length - 1; i > vm.currentSender; i--) {
            var idToRemove = "#level" + i + "";
            var idCss = "#data-level-" + i + "";
            var selectedData = angular.element(idCss).data("kendoDropDownList");
            kendo.unbind(angular.element(idCss));
            kendo.unbind(angular.element(idToRemove));
            selectedData.destroy();
            angular.element(document.querySelector(idToRemove)).remove();
        }
        vm.dataLevel.splice(vm.currentSender + 1);
        vm.currentElement = "#level" + vm.currentSender + "";
    }
}

 

but after this, i traced and i saw that my idToRemove elements still exist in kendo and kendo want to access them via this line

 

var compile = element.injector().get('$compile');
widget._destroy();

 

my app works very good but i have error for every removed element.
Error:

 

TypeError: Cannot read property 'get' of undefined
at http://localhost:46255/Scripts/kendo.all.js:118139:53
at Scope.$digest (http://localhost:46255/scripts/angular.js:17073:23)
at http://localhost:46255/scripts/angular.js:17268:26
at completeOutstandingRequest (http://localhost:46255/scripts/angular.js:5869:10)
at http://localhost:46255/scripts/angular.js:6145:7

 

please help me :(

Georgi Krustev
Telerik team
 answered on 30 Jun 2016
1 answer
131 views

Hi,

is there a way to have the "select" event triggered when selecting an already selected node?

Thanks.
Christian.

Magdalena
Telerik team
 answered on 30 Jun 2016
1 answer
213 views

Hi,

I'm trying to add a custom widget in an editable grid column, I need to be able to modify two inputs in the same cell and display the value of both inputs concatenated by ':'.

i.e.

<input id='input_1' /><input id='input_2' />

once you click on the cell both inputs show up and you can change both values, so, when you get back to your grid view it will show INPUT_1_VALUE:INPUT_2_VALUE.

I haven't been able to get the values for the two inputs at the same time, and I'm only being able to mark the cell as "dirty".

Attached you will find the plugin code, and the grid view so you can see how those textboxes look like.

Thanks,

 

 

Boyan Dimitrov
Telerik team
 answered on 30 Jun 2016
1 answer
305 views

Is there a supported way to extend how many hours are shown on the scheduler when in the 'Business Hour' view? I'm not referring to how to set the start and end of the work day, but how to show a different range of hours than the business hours I have set.

 

For example: I have set my business hours to 9am-5pm, but I would like the scheduler to show the hours of 7am-10pm, without changing the business hours, so it is still grayed out appropriately.

 

Thank you

Vladimir Iliev
Telerik team
 answered on 30 Jun 2016
6 answers
292 views

Overall, I have to admit, I'm finding the map component to be severely lacking.  Thus far, following the directions at this Authoring Maps, I've successfully gotten a geoJSON file of the US, with Alaska and Hawaii.  But I hate the placement of the Alaska and Hawaii shapes.  I have found several other sites, offering much better geoJSON files, but not a single one of them has worked in the Kendo Map component. The fact that it's limited to geoJSON means it's only useful for geographical mapping, which really doesn't suite my needs either.  I don't care about roads or streets, I just need a US map, with Alaska & Hawaii within decent spacing of the other states for sales figures,for maps showing active licenses, different categories of client clusterings.  I've seen a lot of different Javascript libraries that allow to use SVG images for the maps, which this component doesn't.  

 

I like how fast it is, I like the API into it, but as far as offering good customizable maps, it's severely lacking.

Lev
Top achievements
Rank 1
 answered on 29 Jun 2016
6 answers
723 views
Hello guys, I was wondering how could I add a new layer to the dinamically. My map contains two layers with opacity 0 and I would like to add a third layer to use it like principal.
My code by the moment is this:

@(Html.Kendo().Map()
            .Name("mapwrapper")
            .Center(0, 0)
            .Zoom(2)
            .MaxZoom(16)
            .MinZoom(6)
            .Controls(controls=> controls.Navigator(false).Zoom(zoom=>zoom.Position(MapControlPosition.TopLeft)))
            .Layers(layers =>
            {
                layers.Add()
                     .Type(MapLayerType.Tile)
                     .UrlTemplateId("http://#= subdomain #.TILE_SERVER_URL.com/GeoTileServer/#= x #/#= y #/#= zoom #")
                     .Subdomains("tile1", "tile2", "tile3").Opacity(0);

                
                layers.Add()
                   .Type(MapLayerType.Bing)
                   .ImagerySet(MapLayersImagerySet.AerialWithLabels)
                   .Key("PUBLIC_API_KEY").Opacity(0);

                layers.Add()
                 .Style(style => style.Fill(fill => fill.Opacity(0.5).Color("#4C8FFD")))
                 .Type(MapLayerType.Shape)
                 .DataSource(dataSource => dataSource.GeoJson());


            })
                .Events(events => events
                    .PanEnd("panEnd")
                    .ZoomStart("clearCanvas")
                    .ZoomEnd("zoomEnd")
                    .Click("onMapClick")
                    .ShapeCreated("onShapeCreated")
            )
        )

Then in the document ready by javascript I add the third layer like this:

 $(document).ready(function () {
 var shapes22 = {
                        type: "tile",
                        urlTemplate : "http://#= subdomain #.tile2.opencyclemap.org/transport/#= zoom #/#= x #/#= y #.png",
                        subdomains : [ "a", "b", "c" ],
                        attribution : "© <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>." + "Tiles courtesy of <a href='http://www.opencyclemap.org/'>Andy Allan</a>"
                    }

        $("#mapwrapper").data('kendoMap').layers.push(shapes22);
         $("#mapwrapper").data('kendoMap').options.layers.push(shapes22);

        var layers = $(".k-layer");
        layers[2].style.opacity = 1;
}

The object looks good but the map never start downloading the tiles, so like the first two layers have an opacity=0 and the third never download the tiles I get a blank map.

Any solution with this.
Thanks a lot.

Tex
Top achievements
Rank 1
 answered on 29 Jun 2016
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
Drag and Drop
Application
Map
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
DropDownTree
ListBox
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
Styling
ColorPicker
Pager
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
Licensing
PivotGridV2
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
LLM Kit
+? more
Top users last month
Shiori
Top achievements
Rank 2
Iron
Tien
Top achievements
Rank 1
Iron
Robert
Top achievements
Rank 1
Rob
Top achievements
Rank 4
Bronze
Bronze
Iron
Geoff
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Shiori
Top achievements
Rank 2
Iron
Tien
Top achievements
Rank 1
Iron
Robert
Top achievements
Rank 1
Rob
Top achievements
Rank 4
Bronze
Bronze
Iron
Geoff
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?