Telerik Forums
Kendo UI for jQuery Forum
7 answers
149 views

Hi, 

So to expand on my title a bit, I have a grid that displays columns (for example): From address, to Address, cc Address and Subject. And then in a 'detailTemplate' I'd like to display the 'message'. I'd like to use Inline editing to add/edit records if its possible.

Which is why Im here, Is it possible to use inline editing to set/edit an attribute that isnt actually displayed in the grid, or is this something thats outside the scope of the inline edit functionality?

Thanks,
Grant

Dimiter Topalov
Telerik team
 answered on 20 Jan 2017
3 answers
808 views

Hi, 

I dont know much about inline editing so Im a little lost with this error, but whenever I try to add a new row, an error is thrown in the console. However if I edit, no error is thrown.

Dojo Example: http://dojo.telerik.com/OPEXO

There isnt much functionality at this stage as I just started when this came up.

Any advice would be appreciated.

Thanks,
Grant

Dimiter Topalov
Telerik team
 answered on 20 Jan 2017
6 answers
479 views

I have a problem with the tooltip validation appearing in front of some elements and behind others (e.g. input kendo-numeric-text-box).  When I look at the CSS for the span that holds the tooltip it has a z-index of 9999 which looks good, but then it has position:static .  From what I've read around the internet  e.g. https://css-tricks.com/almanac/properties/p/position/

z-index only works when the position is not static.  Indeed if I add

span .k-tooltip-validation {
    position: relative;
}

 

then it appears in front of the numeric text box.  Why is relative not the default setting for the tooltip?

 

Thanks

Scott Waye
Top achievements
Rank 2
Iron
Iron
Veteran
 answered on 20 Jan 2017
2 answers
86 views

Try to select item with keyboard, then remove it and select another one. See http://dojo.telerik.com/ixowO/2

Denis
Top achievements
Rank 1
 answered on 20 Jan 2017
2 answers
447 views

I am trying to bind the keypress event on kendo widgets so that I can fire MVVM change-tracking updates on keypress, instead of blur; the central issue being that I have a Save button linked to a boolean for hasChanges, and this boolean only updates on blur (change) ... I would prefer that it update automatically on keypress, which is not exposed by the kendo widgets.

I have found examples of doing this in Javascript, but we are using typeScript, and the .d.ts file does not contain the data necessary to make this possible. I have found examples of how to deal with this for custom bindings, but not for custom *widget* bindings.

What I want to do is:

kendo.data.binders.widget.keyPress = kendo.data.Binder.extend({
    init: function (element, bindings, options) {
        kendo.data.Binder.fn.init.call(this, element, bindings, options);
        var binding = this.bindings.keyPress;
        $(element.input).bind("keypress", function () { binding.get(); });
    },
    refresh: function () { }
});

 

... but I want to do that in type script, not javascript. It fails on .binders.widget.keyPress, as .binders is only declared as a namespace.

Justin
Top achievements
Rank 1
 answered on 20 Jan 2017
1 answer
630 views

I am trying to export  my master and detail grid to an excel file without success.

When I am debugging I can see that the function $.when.apply(null, detailExportPromises) isn't called.

The detail grid data is found correctly, but no Excel file is downloaded.

My code:

//Add export to excel option for main grid
    gridElement.data("kendoGrid").setOptions({
        excel: {
            allPages: true,
            fileName: "Pikdonot.xlsx",
            filterable: true
        },
        excelExport: function (e) {
            debugger;
            e.preventDefault();
            var workbook = e.workbook;
            detailExportPromises = [];
            var masterData = e.data;
            for (var rowIndex = 0; rowIndex < masterData.length; rowIndex++) {
                exportChildData(masterData[rowIndex].uid, rowIndex);
            }
            debugger;
            $.when.apply(null, detailExportPromises)
            .then(function () {
                debugger;
                // get the export results
                var detailExports = $.makeArray(arguments);
                // sort by masterRowIndex
                detailExports.sort(function (a, b) {
                    return a.masterRowIndex - b.masterRowIndex;
                });
                // add an empty column
                workbook.sheets[0].columns.unshift({
                    width: 30
                });
                // prepend an empty cell to each row
                for (var i = 0; i < workbook.sheets[0].rows.length; i++) {
                    workbook.sheets[0].rows[i].cells.unshift({});
                }
                // merge the detail export sheet rows with the master sheet rows
                // loop backwards so the masterRowIndex doesn't need to be updated
                for (var i = detailExports.length - 1; i >= 0; i--) {
                    var masterRowIndex = detailExports[i].masterRowIndex + 1; // compensate for the header row
                    var sheet = detailExports[i].sheet;
                    // prepend an empty cell to each row
                    for (var ci = 0; ci < sheet.rows.length; ci++) {
                        if (sheet.rows[ci].cells[0].value) {
                            sheet.rows[ci].cells.unshift({});
                        }
                    }
                    // insert the detail sheet rows after the master row
                    [].splice.apply(workbook.sheets[0].rows, [masterRowIndex + 1, 0].concat(sheet.rows));
                }

                // save the workbook
                kendo.saveAs({
                    dataURI: new kendo.ooxml.Workbook(workbook).toDataURL(),
                    fileName: "PikdonotDetails.xlsx"
                });
            });
        },
        toolbar: ["excel"]
    });

 

function exportChildData(uid, rowIndex) {
    debugger;
    var deferred = $.Deferred();
    detailExportPromises.push(deferred);
    var rows = [{
        cells: [
          // First cell
          { value: "YaadPeraon" },
          // Second cell
          { value: "TaarichErech" },
          // Third cell
          { value: "AdditionalDetails" },
          // Fourth cell
          { value: "IsNew" }
        ]
    }];
    var grid = $('#depositsResultGrid').find("tr[data-uid='" + uid + "']").next().find(".closedDepositTrackingResultGrid").data("kendoGrid");
    if (grid) {
        var data = grid.dataSource.data();
        var exporter = new kendo.ExcelExporter({
            columns: [{
                field: "YaadPeraon"
            }, {
                field: "TaarichErech"
            }, {
                field: "AdditionalDetails"
            }, {
                field: "IsNew"
            }],
            dataSource: {
                data: data
            }
        });
        exporter.workbook().then(function (book, data) {
            debugger;
            deferred.resolve({
                masterRowIndex: rowIndex,
                sheet: book.sheets[0]
            });
        });
    }
}

Stefan
Telerik team
 answered on 20 Jan 2017
4 answers
125 views
Hi Team,
In a locked column in grid, When tablet orientation change continuously multiple times with some fast speed, the selected row is dividend in different selected row for locked and unlocked column. This is a intermittent issue. While moving in slow pace this issue may or may not occur.
Joana
Telerik team
 answered on 20 Jan 2017
3 answers
548 views

I have a spreadsheet widget, which is created on page load. I have a button, which populates the data using the transport layer. Every time the button is pressed I need to destroy the spreadsheet and then recreate it. I am doing the following: (our page uses angularjs in case that relevant)

if (spreadSheet != null) {
$("#seasonalitySpreadsheet").data("kendoSpreadsheet").destroy();
}

// recreate spreadsheet here.

However - the first spreadsheet is not being removed from the DOM.

Am I missing something?

Thanks

Marc

Marc
Top achievements
Rank 1
 answered on 20 Jan 2017
1 answer
664 views

Hi, Is there any event which fires when the user changes the layout of the spreadsheet? eg when they hide columns, unhide columns, change the width of columns, or move column positions, pin columns etc? I only need 1 event, as opposed to 1 per different change?

Thanks!

Marc

Boyan Dimitrov
Telerik team
 answered on 20 Jan 2017
2 answers
2.3K+ views

Hi,

Currently we are using the kendo grid for showing the data and retrieving the complete dataset and allowing the kendo grid to set pagination on the client side. But the dataset have been steadily growing and wanted to implement a server side paging setup.As a part of refactor process, the kendo grid is assigned a datasource with transport.read implemented as below (req will have additional parameters that will bound to the UI retrieved from $scope)

$scope.gridDataSource = new kendo.data.DataSource({
        transport: {
            read: function (options) {
                var req = {};
                req.pageNumber = '1';
                req.rowCount = '20';
                $http.post('custom/url', req).
                then(function successCallback(response) {
                    console.log('Success Response');

                }, function errorCallback(response) {
                    console.log('Error Response');
                });
            }
        }
    });

But I am not able to get the page number and the rowcount from options and how can I bind the data coming in the success callback

Would really appreciate any pointers

Thank you

YK

Yatish
Top achievements
Rank 1
 answered on 19 Jan 2017
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
Licensing
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
+? more
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?