Telerik Forums
Kendo UI for jQuery Forum
2 answers
832 views
I am trying to load the culture files(kendo.messages.xx-xx.min.js) from the local disk, is there a good way to do that?

The method you provided is like following:
var baseUrl = 'https://kendo.cdn.telerik.com/2018.3.1017/js/messages/kendo.messages.';
$.getScript(baseUrl + "zh-CN.min.js", function () {
kendo.ui.progress($("#grid"), false);
CreateGrid();
});

I would like to load it like following, but it didn't work for me.
$.getScript("../culture/zh-CN.min.js", function () {
kendo.ui.progress($("#grid"), false);
CreateGrid();
});
Nick
Top achievements
Rank 1
 answered on 30 Oct 2018
10 answers
326 views

I have an application with a grid where the delete button is an icon and a tooltip has to be associated with it.

jQuery("#childrenGrid").kendoTooltip({"filter":".k-grid-delete","content":"Delete"}

The grid is with remote data and the tooltip does not show. If the grid uses not remote data the tooltip appears.

Can I make this work?

Ivan Danchev
Telerik team
 answered on 30 Oct 2018
4 answers
373 views

Dear All,

I am new to Kendo control, please help me with this, I already have Tree View as shown in the attachment, Now I have Expand onclick of button, I know the code to perform Expand, but it doesn't expand complete child nodes, instead it does just only 1 immediate child, if it has more child, we need to keep clicking the Expand button then it does the expand. Please help me how to achive on single click to Expand all the Parent and Child nodes.

Its not repatitive question, I have already searched here,Please help me.

This is My code:   
                  $("#expand").on("click", function(){
                    var treeview = $("#treeview").data("kendoTreeView");
                              treeview.expand(".k-item");
                    })

Kannan
Top achievements
Rank 1
 answered on 30 Oct 2018
4 answers
2.7K+ views

Hi

 

I have severals tabs on the tab strip, each ith its own grid.
When I build the grids from JS code I specify autobind = false.

On with my code, I'm doing a call to filter method on a grid to apply some filter when it loads
and a few lines afterward it calls to dataSource.read method.

When I check the network tab on the dev tools I see The current tab grid is calling twice to get the data,
and the other tabs grid call only once to fetch the data.

 

Why is this behavior?

Attached screenshots of the network tab showing what I mean.

If you need any more data let me know

 

Thanks

Shahar
Top achievements
Rank 1
 answered on 29 Oct 2018
2 answers
139 views

Hi,

Here is html generated for a DropDownList. As you can see, data are well populated.

However when I click on it, I just get "no data found". Maybe I miss something obvious, but I spent hours trying to fix it without success.

Thanks.

 

<select name="K_AGENCE"      id="clientK_AGENCE"      data-bind="value: selected.K_AGENCE,      disabled: isDisabled('dis')" data-role="dropdownlist" style="display: none;" class="k-valid">
<option value="A1">Agence 1</option>
<option value="A2">Agence 2</option>
<option value="A3">Agence 3</option>
<option value="A4">Agence 4</option>
</select>
ANDRE
Top achievements
Rank 1
 answered on 29 Oct 2018
4 answers
720 views

I found a similar thread for this but the solution is for ASP.Net and for a RadTreeView (https://www.telerik.com/forums/119788-multiple-context-menu-in-radtreeview).

How can i implement this using jQuery and a TreeView?

 

Thanks!

Ollie
Top achievements
Rank 1
Iron
 answered on 29 Oct 2018
2 answers
167 views

I am trying to load the culture files(kendo.messages.xx-xx.min.js) from the local disk, is there a good way to do that?

The method you provided is like following:

var baseUrl = 'https://kendo.cdn.telerik.com/2018.3.1017/js/messages/kendo.messages.';
$.getScript(baseUrl + "zh-CN.min.js", function () {
kendo.ui.progress($("#grid"), false);
CreateGrid();
});

 

I would like to load it like following, but it didn't work for me.

$.getScript("../culture/zh-CN.min.js", function () {
kendo.ui.progress($("#grid"), false);
CreateGrid();
});

Dimitar
Telerik team
 answered on 29 Oct 2018
2 answers
5.4K+ views

Hi,

I have used kendo grid for display of data, but I am getting an issue in databound event of the grid in dataItem.set() method, here property is not getting set for each row of the grid.

function ondataBound(e){
    var items = grid.items();
    items.each(function (index) {
        var dataItem = grid.dataItem(this);
        if (dataItem) {
            if (dataItem["ActionTaken"] == "Add"){
                if (rowChanges[dataItem.id]) {
                    for (key in rowChanges[dataItem.id]) {
                        dataItem.set(key, rowChanges[dataItem.id][key]);
                    }
                }
            }
        }   
    }
}

Thanks in advance.
Dipak

 

Dmitry
Top achievements
Rank 2
 answered on 29 Oct 2018
2 answers
248 views

So far my grid works fine but on datetime filter area it creates a extra dropdown filter which I don't want and couldn't find out where it is coming from.

Couldn't figure out why it is creating it only for datetime column.

my js code is:

 

$(document).ready(function () {
                        $("#listing-grid").kendoGrid({
                            dataSource: {
                                type: "json",
                                transport: {
                                    read: {
                                        url: "@Html.Raw(Url.Action("CargoListingList", "Cargo", new { cargoType = cargoType }))",
                                        type: "POST",
                                        dataType: "json"
                                    }
                                },
                                schema: {
                                    data: "Data",
                                    total: "Total",
                                    errors: "Errors",
                                    model: {
                                        fields: {
                                            CargoTitle: { editable: false, type: "string" },
                                            CommodityNames: { editable: false, type: "string" },
                                            CargoQty: { editable: false, type: "number" },
                                            CargoQtyId: { editable: false, type: "string" },
                                            IsPartCargo: { type: "boolean" },
                                            FirstPort: { editable: false, type: "string" },
                                            LastPort: { editable: false, type: "string" },
                                            LaycanStart: { editable: false, type: "datetime" },
                                            LaycanEnd: { editable: false, type: "datetime" },
                                            SeName: { editable: false, type: "string" }
                                        }
                                    }
                                },
                                pageSize: @(defaultGridPageSize),
                        serverPaging: true,
                            serverFiltering: true,
                                serverSorting: true
                    },
                        pageable: {
                            refresh: true,
                            pageSizes: [@(gridPageSizes)]
                            },
                            scrollable: false,
                            sortable: true,
                            filterable: true,
                                columns: [{
                                    field: "CargoTitle",
                                    title: "Title",
                                    width: 315,
                                        headerAttributes: { style: "text-align:center" },
                                    attributes: { style: "text-align:center" },
                                    template: '<a href="/cargo/#=SeName#">#=CargoTitle#</a>',
                                    headerTemplate: '<span title="The cargo listing title">Title <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                    filterable: { extra: false }
                                }, {
                                        field: "CommodityNames",
                                        title: "Commodity(s)",
                                        width: 225,
                                        headerAttributes: { style: "text-align:center" },
                                        attributes: { style: "text-align:center" },
                                        headerTemplate: '<span title="Cargo Commodity(s)">Commodity(s) <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                        filterable: { extra: false }
                                }, {
                                    field: "CargoQty",
                                    title: "Cargo Qty",
                                        width: 125,
                                        template: "#=CargoQty # #=CargoQtyId #",
                                    attributes: { style: "text-align:center" },
                                    headerAttributes: { style: "text-align:center" },
                                    headerTemplate: '<span title="Total Cargo Quantity">Cargo Qty <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
                                }, {
                                        field: "IsPartCargo",
                                        title: "PCGO",
                                        width: 105,
                                        template: '# if(IsPartCargo) {# <i class="fa fa-check true-icon"></i> #} else {# <i class="fa fa-close false-icon"></i> #} #',
                                        attributes: { style: "text-align:center" },
                                        headerAttributes: { style: "text-align:center" },
                                        headerTemplate: '<span title="Part Cargo">PCGO <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                        filterable: { messages: { info: "Part Cargo Availability:", isTrue: "Yes", isFalse: "No" } }
                                }, {
                                        field: "FirstPort",
                                        title: "First POL",
                                        width: 150,
                                        headerAttributes: { style: "text-align:center" },
                                        attributes: { style: "text-align:center" },
                                        headerTemplate: '<span title="First Port of Loading">First POL <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                        filterable: { extra: false }
                                }, {
                                        field: "LastPort",
                                        title: "Final POD",
                                        width: 150,
                                        headerAttributes: { style: "text-align:center" },
                                        attributes: { style: "text-align:center" },
                                        headerTemplate: '<span title="Final Descharging Port">Final POD <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                        filterable: { extra: false }
                                }, {
                                    field: "LaycanStart",
                                    title: "First Layday",
                                    width: 140,
                                        template: "#= kendo.toString(kendo.parseDate(LaycanStart), 'dd/MM/yyyy HH:mm') #",
                                        attributes: { style: "text-align:center" },
                                    headerAttributes: { style: "text-align:center" },
                                        headerTemplate: '<span title="The first day for Laycan">First Layday <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                        filterable: {
                                            ui: "datetimepicker"
                                        }
                                }, {
                                    field: "LaycanEnd",
                                    title: "Cancelation Day",
                                    width: 135,
                                        template: "#= kendo.toString(kendo.parseDate(LaycanEnd), 'dd/MM/yyyy HH:mm') #",
                                        attributes: { style: "text-align:center" },
                                    headerAttributes: { style: "text-align:center" },
                                        headerTemplate: '<span title="The cancelation day for Laycan">Cancelation Day <i class="fa fa-info-circle" aria-hidden="true"></i></span>',
                                        filterable: {
                                            ui: "datepicker"
                                        }
                                }
                            ],
                            filterMenuInit: function (e) {
                                e.container.find('.k-filter-help-text').remove();
                            }
                                        });
 
                    $("#cargoes-grid").kendoTooltip({
                        filter: ".k-header span"
                    });
 
                                        });

 

 

Tsvetomir
Telerik team
 answered on 29 Oct 2018
2 answers
108 views

Hello!

I have a quite complex problem with my grid. I use AngularJS and have a grid in the second tab of a TabStrip. The Grid has a button in the HeaderTemplate of a column which is doing some stuff in the ng-click function (also preventing the sorting). 

Before the grid should load its data (read method of the datasource), I need to get data from the server.

The problem is: The button in the HeaderTemplate doesn't work in this scenario.

 

I created a little example which shows the problem: 

https://dojo.telerik.com/ameMuWOx/6

 

If the second tab initially is set to active, everything works fine:

https://dojo.telerik.com/ijazOZAG

 

It is also working if I don't make the server call before loading the grid AND I remove the ng-if on the grid:

https://dojo.telerik.com/UXUZIHIJ

 

So I would say it's kind of a timing problem? I really have no idea how to get my first plunkr work without making the grid-tab initial active. Maybe someone can help me finding a solution? It's a very complex problem and maybe I did something wrong.

 

For now my solution would be setting the grid-tab initial to active and to switch it programmatically after the grid is finished loading. But that wouldn't be a nice solution.

 

Thanks in advance!

BigzampanoXXl
Top achievements
Rank 1
 answered on 29 Oct 2018
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?