Telerik Forums
Kendo UI for jQuery Forum
1 answer
520 views

Hi

Currently i have an change on an drop in a Grid and then i change some any data too, but i could not refresh grid after all my jquery changes

Regards

In first step i change an codeErreur with an dropdown then i change on others lines in grid same field, but i could not refresh my grid

 

    var getDatasourceFromUrlDetailEtatCompte = function (relativeUrl, schema) {
        return new kendo.data.DataSource({
            transport: {
                dataType: "json",
                read: {
                    url: UtilService.generateApiUrl(relativeUrl)
                }
            },
            change: function (e) {
                if (e.action === "itemchange") {
                    var errload = {
                        type: e.items[0].type,
                        source: e.items[0].source,
                        compte: e.items[0].compte,
                        date: e.items[0].date,
                        facture: e.items[0].facture,
                        total: e.items[0].total,
                        codeErreur: e.items[0].codeErreur
                    };
                    RapportsService.saveErreurEtatCompte(errload).then(function success(response) {
                        console.log('ChangementB:' + response);
                        e.items[0].dirty = false;

                        const ref_facture = e.items[0].facture;
                        const ref_source = e.items[0].source;
                        const ref_codeErreur = e.items[0].codeErreur;


                        var tgrid = e.sender._data;
                        for (var i = 0; i < tgrid.length; i++) {
                            if (tgrid[i].facture == ref_facture && tgrid[i].source != ref_source) {
                                tgrid[i].codeErreur = ref_codeErreur; // change same error code
                                var errload2 = {
                                    type: tgrid[i].type,
                                    source: tgrid[i].source,
                                    compte: tgrid[i].compte,
                                    date: tgrid[i].date,
                                    facture: tgrid[i].facture,
                                    total: tgrid[i].total,
                                    codeErreur: tgrid[i].codeErreur
                                };
                                RapportsService.saveErreurEtatCompte(errload2).then(function success(response2) {
                                }, function error(response2) {
                                    console.log('Error change:' + response2);
                                });

                            }
                        }

                        NotificationService.removeAll();
                        NotificationService.showSuccessP("global.save.success");

                    }, function error(response) {
                        console.log('Changementc:' + response);
                        if (!UtilService.responseValidationParsing(response)) {
                            NotificationService.showErrorP("global.save.error");
                        }
                    });
                }
            },
            schema: schema
        });
    };

Neli
Telerik team
 answered on 13 Jul 2021
1 answer
189 views

I created a kendo map and i'm using a openstreetmap, I also created a layer shape polygon with my coordinates but when I zoom, my shape disappears and I don't know why.

Maybe it is because my shape is not very large (about 1hectare).

I tried with more coordinates (about 100) but it is the same thing.

Should i change the map or just kendo can't zoom on little shape ?

This is my map with zoom 13 :

And with zoom 14, my shape disappears.

My code :

<script>
    $("#map").kendoMap({
   
             center: [48.471504, - 2.457585],
                zoom: 13,
                layers: [{
                    type: "tile",
                   urlTemplate: "http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            subdomains: ["a", "b", "c"]
                }, {
                    extent: [
                        48.499924, - 2.459692,
                        48.45, -2.479
                    ],
                    minZoom: 11,
                    type: "shape",
                    style: {
                        fill: {
                            opacity: 0
                        },
                        stroke: {
                            color: "red",
                            width: 2
                        }
                    },
                    dataSource: {
                        type: "geojson",
                        data: [{
                            "type": "Polygon",
                            "coordinates": [[ listCoordinates                        
                            ]]
                        }]
                    }
                }]
            });
</script>

How can i zoom and see my shape ?

Angel Petrov
Telerik team
 answered on 13 Jul 2021
1 answer
305 views

Hey!

I'm trying to update kendo-ui version to the latest. The initialization code stays the same:


import '@progress/kendo-ui/css/web/kendo.common.less'
import '@progress/kendo-ui/css/web/kendo.default.less'

require('@progress/kendo-ui/js/kendo.all');

It works fine until the version 2020.2.512. Starting from this version and higher "window.kendo" object is still available but jQuery does not contain any of kendo* methods (like $(...).kendoNotification)

So...what changed there?...

I'm using webpack to build the application, jQuery is the latest 3.*

~upd

window.kendo.jQuery has everything in place. But window.jQuery does not

Neli
Telerik team
 answered on 12 Jul 2021
4 answers
278 views

  1. Enable serverPaging, serverSorting, virtual scroll. Please refer the attached codes.
  2. Run the page in browser.
  3. Drag scrollbar to end
  4. Click "name" column header to sort the grid.

Observed:

Grid only shows the last 3 rows.

Question:

How can I make last ten rows show after sort? Like this:


<html>
	<head>

		<link rel="stylesheet" href="styles/kendo.common.min.css"/>
		<link rel="stylesheet" href="styles/kendo.default.min.css"/>

		<script src="jquery-3.6.0.js"></script>
		<script src="kendo.all.js"></script>

		<style>
			.grid {
				width: 800px;
				height: 400px;
			}
		</style>
	</head>
	<body>
		<div class="grid"></div>
<script>
	$(()=>{
	var ds = [];
	for(var i=0;i<13;i++){
		ds[i]={name:i.toString(),number:i};
	}

	var dataSource = new kendo.data.DataSource({
		serverPaging:true,
		serverSorting:true,
		pageSize:10,
		type: "odata",
		transport: {
			read: options=>{
				var d=[];
				for(var i =options.data.skip;i<options.data.skip+options.data.take && i<ds.length;i++){
					d.push(ds[i]);
				}

				var r = {
					d: {
						__count: ds.length,
						results: d
					}
				};

				options.success(r);
			}
		}
	});

	$(".grid").kendoGrid(
		{
			sortable:true,
			columns:["name","number"],
			dataSource:dataSource,
			scrollable: {
				virtual: true
			}
		}
	);
});
</script>
	</body>
</html>

Neli
Telerik team
 answered on 09 Jul 2021
0 answers
153 views
Hello, I have written some custom jquery to conditionally combine columns with a colspan attribute which is added ondatabound... everything works however if I click cancel changes or save changes the colspan immediately gets overwritten to 1 1 instead of the 3 that I have written... thoughts? I am using locked columns as well..
m
Top achievements
Rank 1
Iron
Iron
 asked on 08 Jul 2021
5 answers
2.7K+ views

I'm running into a situation in my MVC app where the Kendo grid seems to be assuming that my date columns are UTC dates and are converting them to local time. Most of my dates are off by one day. 

First of all, is this what the grid is doing? Past posts about issues like this seems to confirm it. If so, can I tell the Kendo grid that my dates are not UTC? We're building an app around an existing database where the dates are not stored as UTC and the dates cannot be converted. If I can't tell the Kendo grid to stop doing this, what alternatives do I have? I know I can represent dates as strings in the grid, but then I lost the ability to sort correctly if the user chooses to sort a date column. Converting all date columns in our database to UTC is not an option.

 

Angel Petrov
Telerik team
 answered on 08 Jul 2021
1 answer
154 views

We are using a custom editor on one of the columns of the kendo spreadsheet. The Kendo spreadsheet contains multiple sheets each having variable number of columns. As of now we are creating all the sheets  with equal number of columns by getting the maximum column count from the sheet having max number of columns and then for the other sheets with less column count , we are hiding them.

I am using the following custom editor code to position the editor with the cells. I am using  ".k-spreadsheet-active-shell.k-right" class to identify the rightmost column and get the position of the column. But now in the current situation because I have some hidden columns after my actual column where I need the custom editor, k-right class is not getting applied .

 

Is there a workaround for this? Can kendospreadsheet contains sheets with different columns count?

Neli
Telerik team
 answered on 08 Jul 2021
1 answer
172 views

Hi, 

Need customization of  Checkboxes on focus need to add arrow showing below options. 

Currently having close ( X ) icon. Need to be add down arrow as per attachment design.

Please assist. 

Neli
Telerik team
 answered on 07 Jul 2021
5 answers
794 views

Hello!
I need a feature for this chat control that is present in Kendo Angular library (https://www.telerik.com/kendo-angular-ui/components/conversationalui/message-templates/)
I'm talking about message templates: the possibility to add a custom template in normal message.
I need it to implement some advance features, like messages deletion and messages modification.

This feature will be present soon in Kendo jQuery library?

Thanks,
Mattia

Damian
Top achievements
Rank 1
Iron
 answered on 07 Jul 2021
2 answers
155 views

Hi,

 

I have following code, and i could editable field marked as editable: false ?

Why regards

            <div kendo-grid="mygrid"
                             class="customTransBg"
                             uib-collapse="hideDifference"
                             k-data-source="mygridDatasource"
                             k-sortable="true"
                             k-editable="true"
                             k-pageable="true"
                             k-filterable="{mode: 'row'}"
                             k-columns='[
                                {field: "source.<spring:message code="global.description"/>",
                                    title:"<spring:message code="rapport.etatcompte.erreurs.colonne.source"/>",
                                    filterable: filteringConfig, editable: false},
                                {field: "compte", title:"<spring:message code="rapport.etatcompte.errors.colonne.compte"/>",
                                    filterable: filteringConfig, "editable": false},
                                {field: "date",title: "<spring:message code="rapport.etatcompte.errors.colonne.date"/>", editable: false,
                                    filterable: filteringConfig},
                                {field: "facture", editable: false,title: "<spring:message code="rapport.etatcompte.errors.colonne.facture"/>",
                                    filterable: filteringConfig},
                                       {field: "total", title:"<spring:message code="rapport.etatcompte.errors.colonne.total"/>", editable: false,
                                    format:"{0:c}",
                                    filterable: filteringNumberConfig},
                                {field: "codeErreur",
                                    defaultValue: {id:" ",descriptionFr:" "},
                                   title: "<spring:message code="rapport.etatcompte.errors.colonne.codeErreur"/>", attributes: {"class": "k-item noCap"}, editor: codeErrorDropDownEditor, template: "#=codeErreur.<spring:message code="global.description"/>#", nullable: false}
                            ]'>
                        </div>

 

 

Georgi Denchev
Telerik team
 answered on 07 Jul 2021
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
MultiColumnComboBox
Chat
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
ScrollView
Switch
BulletChart
Licensing
QRCode
ResponsivePanel
TextArea
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
+? more
Top users last month
Cynthia
Top achievements
Rank 1
Iron
Toby
Top achievements
Rank 3
Iron
Iron
Iron
Danielle
Top achievements
Rank 1
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Iron
yw
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Cynthia
Top achievements
Rank 1
Iron
Toby
Top achievements
Rank 3
Iron
Iron
Iron
Danielle
Top achievements
Rank 1
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Iron
yw
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?